Как сворачивать строки в таблице?
 

Как сделать чтобы при клике на TH в таблице сворачивались все TR, которые находятся ниже, но только до следующего TH?
Таблица:

<table border=1 bordercolor=black width=100%>
  <tr><th colspan=2 onselectstart="return false">Header 1</th></tr>
  <tr><td>Content 1</td><td>Content 2</td></tr>
  <tr><th colspan=2 onselectstart="return false">Header 2</th></tr>
  <tr><td>Content 3</td><td>Content 4</td></tr>
</table>

Скрипт:

$(document).ready(function(){
  $("th").unselectable = "on"; 
  $("th").click(function () {
    if ($(this).parent().next().is(":hidden") ) {
      $(this).parent().nextAll().show();
    }
    else {
      $(this).parent().nextAll().hide();
    }
    //return true;
  });
});

У меня получается только сворачивать вообще все TR.

Обернуть группы строк в теги tbody, после чего скрывать нужный tbody.