javascript - テーブル内の appendChild

Question

これは説明が少し複雑なので、理解していただければ幸いです。

いくつかの折れ線グラフを含むテーブルがあります。表は完全に機能していますが、IE6 と 7 では線が描画されません (8 と 9 は正常に機能しています)。

行を計算する関数を呼び出し、その行で div を作成します。次に、この関数は appendchild() を使用して、その行をテーブルに含めます。

XHTML

<table>
<tr class="outTR">
        <th><h:outputText value="#  {valuegraph}" /></th>
        <c:forEach items="#{valuegraphlist}" var="el">
            <td><h:outputText value="#{value}" /></td>
        </c:forEach>
    </tr>
</table>

ジャバスクリプト

これは私が最初の関数を呼び出す方法です

$(document).ready(function() {
    initgraphics();
});

function initgraphics() {
    var p = $("#imgId_" + firstStep);
    var position = p.position();
    var img = $("img:first", ".stats");
    var i = 0;
    var width2 = img.width() / 2;
    var Y0 = position.top + p.height();
    $("img.img_base", ".stats").each(function() {
        jsBaseX[i++] = $(this).position().left + width2;
    });


    drawLineGraphic(jsBaseX, valuegraph, Y0, "0000FF", "00FF00", true);
}

function drawLineGraphic(BaseX, arrY, Y0, colourDot, colourLine, minus) {

    $.each(BaseX, function() {
        nextX = this;
        nextY = Y0 - arrY[idx];

        doter(nextX, nextY, 4, colourDot);

        lastX = nextX;
        lastY = nextY;
        idx++;
    });
}


function doter(x, y, d,color){
var str="background: #"+color+";
var ele = document.createElement("div");
ele.setAttribute("style", str);
ele.setAttribute("class", "class1");
ele.setAttribute("id", "p_"+x+"_"+y);   
document.body.appendChild(ele);

}

関数がappendChildに到達すると...クラッシュします...

何か案は？？