追加到正確位置時遇到問題

Question

我試圖附加一些HTML，以便我的表將使用tablesorter進行排序。目前，如果您點擊表格信息的第一行，表格將進行排序，我希望觀衆能夠點擊捐款總計在那裏排序。 。 。請看演示，看看我的意思： http://jsfiddle.net/jelane20/kt8jzg9e/8/

如果你看看演示，然後點擊捐贈總計什麼都沒有發生，如果你點擊捐贈總額下第一行的金額，然後它排序。

<table width="100%" bgcolor="#003399" cellspacing="0" cellpadding="1" border="0"> 
    <tbody><tr><td> 
    <table width="100%" bgcolor="#FFFFFF" cellspacing="0" cellpadding="2" border="0"> 
     <tbody> 
     <tr bgcolor="#003399"> 
      <td colspan="4" class="white"><b>Click on the Group for more information: </b></td> 
     </tr> 
     <tr bgcolor="#eeeeee"> 
      <td>&nbsp;</td> 
      <td><b>Group Name</b></td> 
      <td><b>Group Captain</b></td> 
      <td><b>Donation Total</b></td> 
     </tr> 
     <tr bgcolor="#ffffff"> 
      <td></td> 
      <td><a href="#">test1</a></td><td>test test</td> 
      <td>$20.00</td> 
     </tr> 
     <tr bgcolor="#eeeeee"> 
      <td></td> 
      <td><a href="#">test2</a></td> 
      <td>test test</td> 
      <td>$50.00</td> 
     </tr> 
     <tr bgcolor="#eeeeee"> 
      <td></td> 
      <td><a href="#">test3</a></td> 
      <td>test test</td> 
      <td>$30.00</td> 
     </tr> 
     </tbody> 
    </table> 
    </td> 
    </tr> 
</tbody> 
</table> 

這是腳本。 。 。

var $existTable= $('table td table'); 

var $newTable = $('<table id="newTable"><thead></thead><tbody></tbody></table>'); 
$newTable.find('thead').append($existTable.find('tr').eq(2)); 
$newTable.find('tbody').append($existTable.find('tr:gt(1)')); 
$existTable.parent().append($newTable); 


$newTable.tablesorter(); 

這樣會更有意義，如果你在看菲德爾然而 - http://jsfiddle.net/jelane20/kt8jzg9e/8/

太謝謝你了！

Answer 1

JSFIDDLE這是你想要的嗎？

JS代碼

var $existTable= $('table td table'); 
var $newTable = $('<table id="newTable"><thead></thead><tbody></tbody></table>'); 
$newTable.find('thead').append($existTable.find('tr').eq(1)); 
$newTable.find('tbody').append($existTable.find('tr:gt(0)')); 
$existTable.parent().append($newTable); 
$newTable.tablesorter();