[jQuery] Remove rows from tables according to some rules.

[henrikaagaardsoren...@gmail.com]

I have a table like this:
<table>
  <tr class="item_collection_begin">
    <td colspan="3"></td>
  </tr>
  <tr class="item">
    <td class="title"></td>
    <td class="amount"></td>
    <td class="price"></td>
  </tr>
  <tr class="item">
    <td class="title"></td>
    <td class="amount"></td>
    <td class="price"></td>
  </tr>
  <tr class="item_collection_end">
    <td colspan="3"></td>
  </tr>
  <tr class="item_collection_begin">
    <td colspan="3"></td>
  </tr>
  <tr class="item">
    <td class="title"></td>
    <td class="amount"></td>
    <td class="price"></td>
  </tr>
  <tr class="item">
    <td class="title"></td>
    <td class="amount"></td>
    <td class="price"></td>
  </tr>
  <tr class="item_collection_end">
    <td colspan="3"></td>
  </tr>
  <tr class="item_collection_begin">
    <td colspan="3"></td>
  </tr>
  <tr class="item">
    <td class="title"></td>
    <td class="amount"></td>
    <td class="price"></td>
  </tr>
  <tr class="item">
    <td class="title"></td>
    <td class="amount"></td>
    <td class="price"></td>
  </tr>
  <tr class="item">
    <td class="title"></td>
    <td class="amount"></td>
    <td class="price"></td>
  </tr>
</table>

To sum it up I have a rows that acts a header for a collection of item
(class="item_collection_begin).

Is there some way to click on a button and then all the items and
their header (item_collection_begin), and their footer
(item_collection_end, this is not mandatory that they have such one)
are all hidden if there is no item in the collection where the cell
(amount) is bigger than zero?

I have got it to work for all the rows with items:
$('#test .amount').filter(function (index) {
    return $(this).html() == 0;
}).parent().remove();

But this does not hide item_collection_begin (and perhabs
item_collection_end).