Javascript & Html - Modifying Dynamically Created Subclasses Within A Dynamically Created Class

Problem: I have a dynamically created HTML table, that is used for filling out time sheets. It is created programmatically - there is no formal control. The design is a mix of CSS

Solution 1:

For anyone else that ever runs into this issue. I got it. I put the elements by the row class into an array, and then using that array, I got the childNodes from the row class. The reason the variable 'i' starts at 2 and not 0 is because I have 2 fields that are not counted in the TimeSheet table (Jobcode and description). It's working great now.

Cheers.

$(document).on("click", ".cc", function(){
    var c = this;
    if(($(c).children().length) === 0) { 
        var cellval = "";
        if ($(c).text()) {
            cellval = $(this).text();
            if(cellval.length === 0) {
                cellval = $(this).find('.tbltxt').val();
            }
        }
        var twidth = $(c).width() + 21;
        var tid= 't' + c.id;

        if(tid.indexOf('x17') >= 0){
            var thtml = "<input id='t" + c.id + "' type='text' Class='tbltxt' style='width: " + twidth + "px;' readonly />";
            eval(spproc(spcol(t[getx(c.id)],thtml,tid,twidth)));

            // Get current row that has focusvar getRow = $(this).parent().attr('class');
            // Get the row number for passing through to the next statementvar rowPos = getRow.split('r', 5)[1];
            // Get all the elements of the row class and assign them to the rowClass arrayvar rowClass = document.getElementsByClassName('r' + rowPos)
            // Given the rowClass, get the children of the row class and assign them to the new array.var arr = rowClass.item(0).childNodes// Initialize the 'total' variable, and give it a value of 0var tot = 0;
            // Begin for loop, give 'i' the value of 2 so it starts from the 3rd index (avoid the Req Code and Description part of the table).for(var i = 2; i<arr.length; i++){
                if(parseInt(arr[i].innerHTML) > 0){
                    tot += parseInt(arr[i].innerHTML);}
            }
            // Assign focus to the 'Total' cell
            $('#t' + c.id).focus();
            // Assign the 'total' variable to the textbox that is dynamically created on the click.
            $(this).children().val(tot);
        }else{
            var thtml = "<input id='t" + c.id + "' type='text' Class='tbltxt' style='width: " + twidth + "px;' />";
            eval(spproc(spcol(t[getx(c.id)],thtml,tid,twidth)));
            $('#t' + c.id).focus();
            $('#t' + c.id).val(cellval);
        }}
});