Skrypt do rozwijania pol tr

[HTML] pobierz, plaintext 
function pokaz(vname)
{
 
      var elements = document.getElementsByTagName('tr');
      for (var i=0; i<elements.length; i++) {
                var id=elements[i].getAttribute('id');
              //  alert("id"+id);
                if ( id && id.substring(0,vname.length)== vname )
                {
                     if ( elements[i].style.display =='none')
                        elements[i].style.display="";
                     else 
                        elements[i].style.display='none';
                }
      }
 
}
[HTML] pobierz, plaintext 

Do tego mam tabelkę z polami:

[HTML] pobierz, plaintext 
	<table>
<tr>
    <td><a id="1111" onClick="pokaz('1111');" style="display: block;">Kategoria</a></td>
    <td></td>
</tr>
 
<tr style="display:none;" id="1111">
    <td>podkategoria1</td>
    <td></td>
</tr>
 
<tr style="display:none;" id="1111">
    <td><a id="2222" onClick="pokaz('2222');" style="display: block;">podkategoria2 (rozwijana)</a></td>
    <td></td>
</tr>
 
<tr style="display:none;" id="2222">
    <td>pod podkategoria</td>
    <td></td>
</tr>
</table>
 
[HTML] pobierz, plaintext 

Problem pojawia się w przypadku kiedy rozwinę Kategoria nastepnie podkategoria2 (rozwijana) i chcę zwinąć całą Kategoria to niestety nie zwija sie wszystko i pozostaje to co zostalo klikniete czyli id 2222 - pod podkategoria czyli:
Kategoria
pod podkategoria

a powinno sie zwinac wszystko.

Czy ktos ma jakis pomysl jak to zrobic zeby zwijalo sie calosc?

Do takich rzeczy uzywa się zagnieżdzonych UL a nie tabelki z TR. Jakbys zrobil to jak trzeba na UL, to chowając dane UL chowalbys wszystkie dzieci i nie musiał kombinowac.

z tym, że tutaj są dane tabelkowe wartości obliczenia, których nie podałem nie jest to struktura kategorii i podkategorii to był może zły przykład, więc tabelki są niezbędne

Ktoś pomoże? Piwko stawiam!

Proszę, działa na pół-sztywno więc się nie ciesz ale piwko się należy
http://jsfiddle.net/8jgt8ddz/

ale wykozaczyłem po miesiącu;]

Serio?

http://jsfiddle.net/sc2LbygL/

[HTML] pobierz, plaintext 
	<table>
<tr>
<td><a id="1111" onClick="pokaz('1111');" style="display: block;">Kategoria</a></td>
<td></td>
</tr>
 
<tr style="display:none;" id="1111">
<td>podkategoria1</td>
<td></td>
</tr>
 
<tr style="display:none;" id="1111">
<td><a id="2222" onClick="pokaz('2222');" style="display: block;">podkategoria2 (rozwijana)</a></td>
<td></td>
</tr>
 
<tr style="display:none;" id="2222">
<td>pod podkategoria</td>
<td></td>
</tr>
</table>
[HTML] pobierz, plaintext 

i tak nie będzie piwka