How do I search and remove/append a row in Jquery or Javascript? -

if have table

<table id="mytable"><tr><td>first thing</td><td>first value</td></tr> <tr><td>second thing</td><td>second value</td></tr> <tr><td>third thing</td><td>third value</td></tr> </table> 

how can use jquery or javascript search index of row text "second value" , remove it? possible create new row

<tr><td>fourth thing</td><td>fourth value</td></tr> 

with click of button? have iterate through existing rows last index of row insert in?

you can achieve using :contains() selector, remove() function, , append() function. don't need iterate through rows find you're looking for.

---

to index:

$("#mytable").find("td:contains('second value')").parent().index(); 

to remove it:

$("#mytable").find("td:contains('second value')").parent().remove(); 

to add row:

$("#mytable").append("<tr><td>fourth thing</td><td>fourth value</td></tr>"); 

---

working example: http://jsfiddle.net/hunter/pzjwc/