使用jQuery动态添加表格行

Question

我有一个页脚行，用于将新行添加到HTML表格。出于某种原因，当我添加一个新行时，它会删除页脚行。我希望在页脚之前添加新行。

例子：

Row 1 
Row 2 
Row 3 
Footer Row with Add new row button 

当添加按钮被点击它应该是这样的：

Row 1 
Row 2 
Row 3 
New Row added 
Footer Row 

这里是我的代码：

function addAddHocRow(tr) { 

    $('#tblBuilder_Body tr:last').before(tr); 
} 

TR从按钮传递点击方法。上面的代码删除了页脚行。

tr来自链接按钮，它被动态添加为html表格的列。

function addAddHocRowLink(td) { 

    var addLink = $("<a/>").click(function() { 

     addAddHocRow($(td).parent()); 

    }).text("Add"); 

    $(td).append(addLink); 
} 

其实我想提出一个新的TR对象，然后填充TD的。每个td都有特定的元素，如复选框，下拉列表等。之后，tr被添加到表中。

更新2：

下面是一些代码，显示TDS如何填充。

var addHocRowTds = $(addHocRow).find('td'); 
// append add button 
    addAddHocRowLink(addHocRowTds[6]); 

Answer 1

这里有一个工作的jsfiddle：http://jsfiddle.net/cMJ2e/1/