javascript - jquery add/delete html row -


I have a simple HTML table where I want to dynamically add rows by removing it. There is a delete icon in the HTML table, clicking on which a jquery script line is deleted.
Code for table:

  & lt; Table id = "table1" & gt; & Lt; Tr & gt; & Lt; TD & gt; & Lt; Img class = "delete" alt = "delete" src = "delete_icon.png" /> & Lt; / TD & gt; & Lt; / TR & gt; & Lt; / Table & gt;   

A link adds a new line:

  & lt; A href = "#" name = "add-on" & gt; Add Row & lt; / A & gt;   

Both jquery scripts above the HTML table code:

  & lt; Script type = "text / javascript" & gt; / * Delete line * / $ (document) .ready (function () {$ ('# table1 td img.delete'). Click (function () {$ (this) .Parent () .Parent (). Remove ();});}); / * Add new line * / $ (document) .ready (function () between the // {// code will be done only when document $ ("a [name = addRow]"). (Function () The code between {/ /} will be executed only when a link is clicked and it has the name of AdWords ("Table # Table 1 tr: last"). ('& Lt; tr & gt; & lt; Td & gt; img class = "delete" alt = "delete" src = "@ Url.Content (" ~ / content / delete_icon.png ")" /> gt; & lt; / td & gt; Lt; / tr & gt; '); Return return;});}); & Lt; / Script & gt;   

The problem is: delete both and enter operation tasks. However, when I add a new line and try to delete this line, then nothing happens. I can already delete existing rows; new scripts do not work on added rows.

Any ideas?

You live ()

  $ ('# Table1 td img.delete') Live ('click', function () {...}); $ ("A [name = addRow]"). Live ('click', function () {...});    

Comments