$.each with (live,bind,delegate) jQuery
<p>Can someone help me with this code:</p>

<pre><code>var rows = $(".delete"); //rows to delete
var irows = $(".insert");//rows to insert
//delete row
$.each(rows, function(i ,v) {
    $(v).click(function() {
        $(this).closest("tr").fadeOut(300, function() { $(this).remove(); });               
    });
});

//insert row before
$.each(irows, function(i, v) {
    $(v).click(function() {
        var irowIndex = $(this).closest("tr").index();
        var newRow = "&lt;tr class=\"dataRow\"&gt;" + "
                    "&lt;td&gt;&lt;input type=\"button\" value=\"&amp;#8597\" class=\"drag\" /&gt;&lt;input type=\"button\" value=\"&amp;#187;\" class=\"insert\" /&gt;&lt;input type=\"button\" value=\"x\" class=\"delete\" /&gt;&lt;/td&gt;&lt;td&gt;&lt;input type='hidden' name='records_id[]' /&gt;&lt;input style=\"text-align: center\" type='text' class='itemno' name='existing_itemno[]' size='5' /&gt;&lt;/td&gt;" +
                    "&lt;td&gt;&amp;nbsp;&lt;/td&gt;" +
                    "&lt;td&gt;&amp;nbsp;&lt;/td&gt;" +
                    "&lt;td&gt;&amp;nbsp;&lt;/td&gt;&lt;/tr&gt;";
        $("#tbox tr:eq(" + irowIndex + ")").before(newRow);
    });
});

&lt;table id="#tbox"&gt;
    &lt;tr&gt;
        &lt;td&gt;&amp;nbsp;&lt;/td&gt;
        &lt;td&gt;&amp;nbsp;&lt;/td&gt;
        &lt;td&gt;&amp;nbsp;&lt;/td&gt;
        &lt;td&gt;&amp;nbsp;&lt;/td&gt;
    &lt;/tr&gt;
&lt;/table&gt;
</code></pre>

<p>Adding and deleting row works, but the button in the added rows that triggers the delete/insert does not work. I mean if you add a row and you click delete button on that row, it won't work. I've already searched the web, and I found <code>bind()</code>, <code>live()</code>, and <code>delegate</code>. The problem is how I can use it inside <code>.each</code>. Or is there a better approach than this? Please help.</p>
