onClick problém

Dobrý den mám problém.

jako menu při své práci na webu jsem použil trochu asi netradiční způsob a to způsob roklikávací. Tzn. že vždy nejdříve rokliknu nějaký prvek dejem tomu základní škola a z toho mi vyjedou terpve třídy a ty odkazují na stránku. Více méně to vypadá asi takto:
před rozkliknutím
ZÁKLADNÍ ŠKOLA
STŘEDNÍ ŠKOLA
VYSOKÁ ŠKOLA
po rozkliknutí
ZÁKLADNÍ ŠKOLA
STŘEDNÍ ŠKOLA
1.a
2.a
3.a
4.a
...
9.a
VYSOKÁ ŠKOLA


Pokud rozkliknu vysokou školu tak bych chtěl aby se mi střední škola zavřela. zkoušel jsem onclick ale to mi vždy zůstane otevřené takže pokud rozkliknu těchto prvků více vyjedu jakoby ze čtverce který tomu mám vymezený. Potřeboval bych tedy aby když rozkliknu střední školu a poté vysokou aby zároven s rozkliknutím vysoké se zavřela střední a nemusel jí zpětně zavírat dalším kliknutím... Tak snad jsem problém popsal jasně.

tak takhle to vypadá

<script>
function zobrazSkryj(idecko){
el=document.getElementById(idecko).style;
el.display=(el.display == 'block')?'none':'block';
}
</script>
<style>
h3 {cursor: pointer; cursor: hand; text-decoration: underline}
.skryvany {display: none}
</style>


<h3 onclick="zobrazSkryj('oddil2');return false"><a href="#"><img src="2. ročník.png" width="180" height="45"></h3><div id="oddil2" class="skryvany">
1.řádek
2.řádek
3.řádek
4.řádek
</div>
<h3 onclick="zobrazSkryj('oddil3');return false"><a href="#"><img src="3. ročník.png" width="180" height="45"></h3><div id="oddil3" class="skryvany"> 1.řádek
2.řádek
3.řádek
4.řádek
5.řádek
</div>