使用jQuery操作HTML表

Question

我的桌子看起来像这样：

我在硬编码的几页上有相同的图表。

我希望能够使用js和jQuery更改所有页面上的表

我想这样做，以便 YTD 按钮位于From Date输入旁边 并且 MTD 位于To Date输入旁边。

我试过这样做： http://jsfiddle.net/maniator/W9YFF/9/

但它似乎在某些方面搞砸了。

我该如何解决？

---

更新

如果我尝试

$('input[type="button"][value="YTD"]').insertAfter($('#fdate'));
$('input[type="button"][value="MTD"]').insertAfter($('#tdate'));

我的结果如下：

Answer 1

我是否误解了这里至关重要的事情，或者只是这样做了？

$('input[type="button"][value="YTD"]').insertAfter($('#fdate'));
$('input[type="button"][value="MTD"]').insertAfter($('#tdate'));

示例：http://jsfiddle.net/niklasvh/TghZ3/

修改

如果您想改编表结构，可以这样做：

$(".main tr:not(:first):not(:last)").append($('<td />'));
$(".main tr:first th, .main tr:last td").attr('colspan',3);


$(".main tr:lt(2) td:last").append($('.YTD'));
$(".main tr:lt(3) td:last").append($('.MTD'));

示例：http://jsfiddle.net/niklasvh/TghZ3/41/

编辑2

如果您只想在这两行中添加新单元格，请将剩余单元格添加到其中：

$(".main td:last-child:not(.first)").attr('colspan',function(i,a){
    if (typeof a == "undefined") a = 1;
    return (parseInt(a)+1);
});

$(".main tr:first th, .main tr:last td").attr('colspan',3);


$(".main tr:lt(2) td:last").attr('colspan','').after($('<td />').append($('.YTD')));

$(".main tr:lt(3) td:last").attr('colspan','').after($('<td />').append($('.MTD')));

示例：http://jsfiddle.net/niklasvh/TghZ3/57/