jqueryを使用して指定された行の後に行を挿入します

Question

私は同様の例を見ましたが、私が探しているものを正確に見ていません。
時刻に基づいてスケジューリングシステムを作成しました。
これは24行あることを意味します。
各行の最初のtdには、クラス「go」のボタンがあります。
スニペットを作成しようとしています...行がクローンされてテーブルの次の行に挿入される特定の行で個々のボタンがクリックされたときにスニペットを作成しようとしています。
私はこれを1つのボタンで行い、insertAfterオブジェクトを使用しました。
私は自分で何かをしなければならないと思っていますが、あまりよく慣れていません。
これは試行の例です。
この場合、私はgoのIDを使用していましたが、ID to_be_clonedの隠しtrを作成し、1行後に挿入しました。
その行ボタンをクリックした後に他の行の後に行を挿入できる必要があります。 （それが意味をなさない場合）

$("#go").click(function() { 
    $("#to_be_cloned").clone().show().attr('id','').insertAfter("#1"); 
}) 

Answer 1

ではなく、IDのボタンにイベントをバインドするクラスを使用して、あなたはこれを試すことができます。 IDが重複していてもIDは数値で始めることはできません。

<table> 
    <tr> 
     <td><input type="button" class="insertButton" value="Go"/></td> 
     <td>Hello World</td> 
    </tr> 
</table> 


$(document).ready(function(){ 
    $('.insertButton').live('click', function(){ 
     var row = $(this).closest('tr').clone(); 
     $(this).closest('table').append(row); 
    }); 
}); 

jsFiddle Example

Answer 2

すべての行を同じクラスにします。

$(".rowClass .go").live('click', function() { //clicked go in this row 
    var row = $(this).parents(".rowClass"); 
    row.clone().show().insertAfter(row); 
}); 

フィドル：http://jsfiddle.net/maniator/E4K39/

Answer 3

JS：

$(".go").live('click', function() { 
    var $tr = $(this).closest('tr'); 
    $tr.clone().insertAfter($tr); 
}); 

HTML：

<table> 
    <tr> 
     <td><a href="#" class="go">Go</a></td> 
     <td>somethign</td> 
     <td>another 1</td> 
    </tr> 
    <tr> 
     <td><a href="#" class="go">Go</a></td> 
     <td>somethign</td> 
     <td>another 2</td> 
    </tr> 
    <tr> 
     <td><a href="#" class="go">Go</a></td> 
     <td>somethign</td> 
     <td>another 3</td> 
    </tr> 
</table> 

jsfddle：http://jsfiddle.net/jYMmu/4/