Extjs dom and Ext.Element creation problem

I create elements with Ext.element like this:

var table = new Ext.Element(document.createElement('table'));

    for(n=0;n<5;n++)
    {
        row = new Ext.Element(document.createElement('tr'));
        for(x=0;x<4;x++)
        {
            col = new Ext.Element(document.createElement('td'));
   开发者_高级运维         col.update('cell text '+x);    
            row.appendChild(col);
        }
        table.appendChild(row);
    }

    Ext.fly('data').replaceWith(table);

This works i FF but not in IE, why is that?

---

The following code worked in IE8 with ExtJS 3.3

var table = new Ext.Element(document.createElement('table'));

for(n=0;n<5;n++)
{
    var row = new Ext.Element(document.createElement('tr'));
    for(x=0;x<4;x++)
    {
        var col = new Ext.Element(document.createElement('td'));
        col.update('cell text '+x);    
        row.appendChild(col);
    }
    table.appendChild(row);
}

Ext.fly('data').replaceWith(table);

---

Try to use Ext.DomHelper for creating DOM elements and working with them. Have a look at the DomHelper at Ext API Documentation and follow this tutorial.

---

This is a old post but for those who are still looking for answers, please check below code it should work fine in IE.

var table = new Ext.Element(document.createElement('table'));
var tbody = new Ext.Element(document.createElement('tbody'));
for(n=0;n<5;n++)
{
    var row = new Ext.Element(document.createElement('tr'));
    for(x=0;x<4;x++)
    {
        var col = new Ext.Element(document.createElement('td'));
        col.update('cell text '+x);    
        row.appendChild(col);
    }
    tbody.appendChild(row);
}
table.appendChild(tbody);

Ext.fly('data').replaceWith(table);