HTML table generated by JQuery not working in IE9

Question

Hey been having a lot of trouble with this. A table that is being generated by jQuery is working fine in all browsers I need to support except for IE9. The table is supposed to look like

but is displaying like this in IE9

Those course terms are being rendered as one giant text instead of individual tds.

It is supposed to look like so:

Here is the code that is generating the table.

    tempDiv = document.createElement("div");
    tempDiv.id = "courseAvailabilityTitle";

    var availabilityLabel = $('#availabilityLabel').val();

    if(availabilityLabel != null){
        tempDiv.innerHTML = availabilityLabel;
    }
    else{
        tempDiv.innerHTML = "Course Availability";
    }
    bodyDiv.appendChild(tempDiv);

    // Course Availability Table
    tempDiv = document.createElement("div");
    tempDiv.id = "courseAvailability";
    html = "<table align=\"center\" cellspacing=\"0\" cellpadding=\"3\" border=\"0\">";
    html += "<tr id=termAvailability>";

        for ( var i = 0; i < courseDesc.termHeaders.length; i += 1) {
            html += "<td class=\"availabilityTerms\">"
                    + courseDesc.termHeaders[i] + "</td>";
        }

    html += "</tr><tr id=\"termsRow\">";

    for ( var i = 0; i < courseDesc.availability.length; i += 1) {
        html += "<td class=\"availabilityBox\">&nbsp;</td>";
    }

I was thinking the problem may be in the html+=. I tried replacing this with an .append but couldn't get it to work correctly. Any help or idea's would be greatly appreciated, this has been driving crazy. Thanks!

Answer 1

This JSFiddle should work.

Here is what I see in the dev tool (IE10, in IE9 standards mode):

I was unable to reproduce your exact problem, but I found that the appendChild() statement in the middle was causing some bad output for me, eg "undefined" , or "[Object object]" . I moved the append down to the end and it seems to work fine.

document.getElementById('bodyDiv').appendChild(tempDiv);

If that doesn't help, maybe try explicitly adding a tbody before adding rows.