how to remove table row based on contents of one of the cells in the row (with jquery)

Question

hello, i'm trying to delete one row in a dynamically generated table; the problems is that none of these rows have any class or ids generated and i can't get at the code. it generates code like this:

<tr>
    <td class="label">Who referred you?</td>
    <td class="data">somebody</td>
</tr>
<tr>
    <td class="label">terms</td>
    <td class="data">these are the terms</td>
</tr>

is there any way to get at the row that has "terms" (in this case the 2nd row) and delete that whole row? something with the text() and filter() that i dont understand? i know i can delete the 2nd row easily, but sometimes it will be the 2nd and sometime not. thanks very much.

Answer 1

With jQuery:

$(".profile-fields tr:contains('terms')").remove();​​​​

see it in action

without jQuery (if speed is a concern):

var rows = document.getElementsByTagName("tr");
for (var i = rows.length; i--;) {
  if(rows[i].innerHTML.indexOf("terms") !== -1) {
    rows[i].parentNode.removeChild( rows[i] );
  }
}

Answer 2

actually, i figured it out:

$j(".profile-fields td:contains('terms')").parent().remove();