Question

I have a html table with the following structure:

<table>
<tbody>
  <tr><th>heading1</th></tr>
  <tr style="display: none"> <td>data1</td></tr>
  <tr style="display: none"> <td>data1</td></tr>
</tbody>

<tbody>
  <tr><th>heading2</th></tr>
  <tr> <td>data1</td></tr>
  <tr style="display: none"> <td>data1</td></tr>
</tbody>
</table>

I am looking for a way to select a row in that table that holds heading, but whose all siblings are hidden, in this example, heading2 wouldn’t be selected because only one row is hidden.

Answer 1

var tr = $('tr:first-child').filter(function() {
  return $(this).siblings(':hidden').length == $(this).siblings().length;
});

Example: http://jsfiddle.net/u6Qj5/1/