Multiple append calls in Jquery failing in IE 8

[yenpooh]

So I'm working on a web application that uses jquery to parse xml data and add it to a table dynamically. Theres four tables that get toggled on the same part of the page. Here's the relevant html:\[code\]<div id = "toggleSection"><div id = "autoPrevData"></div><div id = "firePrevData"></div><div id = "auto1Data"></div><div id = "auto2Data"></div><div id = "auto3Data"></div></div>\[/code\]And this is the Jquery function with AJax:\[code\] $("#autoEarly").click(function() { if (!$("#firePrevData").is(":hidden")) { $("#firePrevData").toggle('slow'); } if (!$("#auto1Data").is(":hidden")) { $("#auto1Data").toggle('slow'); } if (!$("#auto2Data").is(":hidden")) { $("#auto2Data").toggle('slow'); } if (!$("#auto3Data").is(":hidden")) { $("#auto3Data").toggle('slow'); } if (loadedModels[0]) { loadedModels[0] = false; $.ajax ({ type: "GET", url: "dashboard_auto.xml", dataType: "xml", success: parseXml_AutoEarly }); } else { $("#autoPrevData").toggle('slow'); } return false; });\[/code\]And this is the function that actually parses the xml:\[code\] function parseXmlEarlyPrevention(xml, xmlRoot, data) { //First Header $(data).append("<table><tr><th colspan='5'>Model Information</th><th colspan='4'>Score Metrics</th><th colspan='5' >Variable Metrics</th><th colspan='5' style='600;'>Pseudo-Standardized Coefficient Metrics</th></tr>"); //Second headers $(data).append("<tr><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td>&nbsp;</td><td class='thickBorder'>&nbsp;</td><td colspan='2' style='font-size:1em; color:#888888; border-right:1px solid black'>PSI:</td><td colspan='2' style='font-size:1em; color:#888888; border-right:2px solid black;'>Divergence:</td><td colspan='2' style='font-size:1em; color:#888888; border-right:1px solid black;'>Divergence:</td><td colspan='3' style='font-size:1em; color:#888888; border-right:2px solid black;'>Largest Divergence:</td><td colspan='2' style='font-size:1em; color:#888888; border-right:1px solid black;'>Sum of Changes:</td><td colspan='3' style='font-size:1em; color:#888888;'>Largest Change in Relative Importance:</td></tr>"); //Third Headers $(data).append("<tr><td>Model</td><td>Avg Rank</td><td>Benchmark</td><td>Current</td><td class='thickBorder'># in Curr Period</td><td>Rank</td><td class='thinBorder'>Value</td><td>Rank</td><td class='thickBorder'>Value</td><td>Rank</td><td class='thinBorder'>Average</td><td>1st</td><td>2nd</td><td class='thickBorder'>3rd</td><td>Rank</td><td style='border-right:1px solid black;'>Value</td><td>1st</td><td>2nd</td><td>3rd</td></tr>"); var x = 1; $(xml).find(xmlRoot).each(function() { if (x % 2 == 1) { $(data).append("<tr>"); $(data).append("<td class='dataCellBlue'><a href = 'http://stackoverflow.com/questions/10759484/modelInfo.php?model=" + $(this).find("model").text() + "$type=earlyPrev'>" + $(this).find("model").text() + "</a></td>"); $(data).append("<td class='dataCellBlue'>" + $(this).find("avg_rank").text() + "</td>"); $(data).append("<td class='dataCellBlue'>" + $(this).find("benchmark").text() + "</td>"); $(data).append("<td class='dataCellBlue'>" + $(this).find("current").text() + "</td>"); $(data).append("<td class='dataCellBlue thickBorder'>" + $(this).find("n_current").text() + "</td>"); $(data).append("<td class='dataCellBlue " + $(this).find("psi_color").text() + "'>" + $(this).find("psi_rank").text() + "</td>"); $(data).append("<td class='dataCellBlue thinBorder'>" + $(this).find("psi").text() + "</td>"); $(data).append("<td class='dataCellBlue'>" + $(this).find("divergence_rank").text() + "</td>"); $(data).append("<td class='dataCellBlue thickBorder'>" + $(this).find("divergence").text() + "</td>"); $(data).append("<td class='dataCellBlue" + $(this).find("var_color").text() + "'>" + $(this).find("var_div_rank").text() + "</td>"); $(data).append("<td class='dataCellBlue thinBorder'>" + $(this).find("avg_var_div").text() + "</td>"); $(data).append("<td class='dataCellBlue" + $(this).find("worst_div_col1").text() + "'>" + $(this).find("worst_div1").text() + "</td>"); $(data).append("<td class='dataCellBlue" + $(this).find("worst_div_col2").text() + "'>" + $(this).find("worst_div2").text() + "</td>"); $(data).append("<td class='dataCellBlue thickBorder" + $(this).find("worst_div_col3").text() + "'>" + $(this).find("worst_div3").text() + "</td>"); $(data).append("<td class='dataCellBlue" + $(this).find("psc_color").text() + "'>" + $(this).find("psc_rank").text() + "</td>"); $(data).append("<td class='dataCellBlue thinBorder'>" + $(this).find("sum_psc").text() + "</td>"); $(data).append("<td class='dataCellBlue" + $(this).find("worst_psc_col1").text() + "'>" + $(this).find("worst_psc_var1").text() + "</td>"); $(data).append("<td class='dataCellBlue" + $(this).find("worst_psc_col2").text() + "'>" + $(this).find("worst_psc_var2").text() + "</td>"); $(data).append("<td class='dataCellBlue" + $(this).find("worst_psc_col3").text() + "'>" + $(this).find("worst_psc_var3").text() + "</td>"); $(data).append("</tr>"); } else { $(data).append("<tr>"); $(data).append("<td><a href = 'http://stackoverflow.com/questions/10759484/modelInfo.php?model=" + $(this).find("model").text() + "$type=earlyPrev'>" + $(this).find("model").text() + "</a></td>"); $(data).append("<td>" + $(this).find("avg_rank").text() + "</td>"); $(data).append("<td>" + $(this).find("benchmark").text() + "</td>"); $(data).append("<td>" + $(this).find("current").text() + "</td>"); $(data).append("<td class='thickBorder'>" + $(this).find("n_current").text() + "</td>"); $(data).append("<td class='" + $(this).find("psi_color").text() + "'>" + $(this).find("psi_rank").text() + "</td>"); $(data).append("<td class='thinBorder'>" + $(this).find("psi").text() + "</td>"); $(data).append("<td>" + $(this).find("divergence_rank").text() + "</td>"); $(data).append("<td class='thickBorder'>" + $(this).find("divergence").text() + "</td>"); $(data).append("<td class='" + $(this).find("var_color").text() + "'>" + $(this).find("var_div_rank").text() + "</td>"); $(data).append("<td class='thinBorder'>" + $(this).find("avg_var_div").text() + "</td>"); $(data).append("<td class='" + $(this).find("worst_div_col1").text() + "'>" + $(this).find("worst_div1").text() + "</td>"); $(data).append("<td class='" + $(this).find("worst_div_col2").text() + "'>" + $(this).find("worst_div2").text() + "</td>"); $(data).append("<td class='thickBorder" + $(this).find("worst_div_col3").text() + "'>" + $(this).find("worst_div3").text() + "</td>"); $(data).append("<td class='" + $(this).find("psc_color").text() + "'>" + $(this).find("psc_rank").text() + "</td>"); $(data).append("<td class='thinBorder'>" + $(this).find("sum_psc").text() + "</td>"); $(data).append("<td class='" + $(this).find("worst_psc_col1").text() + "'>" + $(this).find("worst_psc_var1").text() + "</td>"); $(data).append("<td class='" + $(this).find("worst_psc_col2").text() + "'>" + $(this).find("worst_psc_var2").text() + "</td>"); $(data).append("<td class='" + $(this).find("worst_psc_col3").text() + "'>" + $(this).find("worst_psc_var3").text() + "</td>"); $(data).append("</tr>"); } x++; }); $(data).append("</table>"); $(data).toggle("slow"); }\[/code\]The problem is that only the html in the first $(data).append() call is being displayed and nothing afterwards. It works fine in safari and firefox, but it's for work and I need it working on IE. I've been pouring the internet for hours trying to find a good explanation but so far I've had no luck, and frankly its driving me a bit nuts. Thanks for any help