How to add new row to a html table in ExtJS

Hello I have worked with regular tables and javascript to add new rows 开发者_JS百科at the end of table, could someone help me out with adding new row containing html elements at the end of table?

The easiest way is with an Ext.Template

var tpl = new Ext.Template(
    '<tr>',
        '<td>{0}</td>',
    '</tr>'
);
tpl.append('myTable', [ Ext.id() ]);

Check a working example here: http://jsfiddle.net/chrisramakers/xG3wq/

Updated example:
http://jsfiddle.net/chrisramakers/ZcQAX/

If you are dealing with a more complicated dom insert you might consider using a template created using Ext.DomHelper shown below.

var tpl = Ext.DomHelper.createTemplate({
    tag: 'tr', children: [{
        tag: 'td', html: '{0}'
    }]
});
tpl.append('myTable', [ Ext.id() ]);

http://dev.sencha.com/deploy/dev/docs/?class=Ext.DomHelper