Question

I’ve got a page with a handful of input fields.

I need to find the fields with an array of values, and if so, .remove() the closest('tr')

The markup is similar to this

<table>
  <tr>
    <td>
      <input type="text" value="this">
    </td>
  </tr>
  <tr>
    <td>
      <input type="text" value="that">
    </td>
  </tr>
  <tr>
    <td>
      <input type="text" value="them">
    </td>
  </tr>
</table>

I need to find “this” and “that”, and if they are there, remove their <tr> container (and themselves) so I’d end up with:

<table>
  <tr>
    <td>
      <input type="text" value="them">
    </td>
  </tr>
</table>

I’ve tried this:

jQuery(document).ready(function($){
    var badfields = ['this', 'that'];
    var fieldvalue = $('input[type="text"]').val();

    if($.inArray(fieldvalue, badfields) > -1){
        $(this).closest('tr').remove();   
    }
});

but it doesn’t seem to want to work?

Answer 1

You need to iterate over all the fields using .each, so something like this:

$('input[type="text"]').each(function() {
    var fieldvalue = $(this).val();

    if ($.inArray(fieldvalue, badfields) > -1) {
        $(this).closest('tr').remove();   
    }
});

Example: jsfiddle