Tree Menu lidt hjælp ønskes

Vi starter med koden :) --->

<script type="text/javascript">
function toggleDiv(divName) {
    var thisDiv = document.getElementById(divName);
    if (thisDiv) thisDiv.style.display = !thisDiv.offsetWidth ? "block" :"none";       
}

</script>
    <!-- SOFTWARE stats -->
    <img id="fold1" src="/superuser/GFX/foldud.gif">&nbsp;<a href="java script:void(0)" onclick="java script:toggleDiv('menu11');java script:toggleDiv('menu12');java script:toggleDiv('menu13');">Software Stats</a><br />

        <div id="menu11" style="display:none; font-size:11px;">
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="GFX/icon_soft.gif" width="16px">&nbsp;<a href="java script:void(0)" onclick="java script:toggleDiv('menu111');">Software1</a><br />
        </div>
        <div id="menu111" style="display:none; font-size:11px;">
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="GFX/icon_doc.png" width="16px">&nbsp;Users<br />
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="GFX/icon_doc.png" width="16px">&nbsp;Country<br />
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<img src="GFX/icon_doc.png" width="16px">&nbsp;Language<br />

</div>

<----

Okay, først, når man klikker på 'menu1' skal billed fold1 skifte fra 'foldud.gif' til 'foldind.gif' og omvendt... lige som menuen i feks windows stifinder.

Det største problem :=)

Strukturen er
  - Menu1
  - Menu12
    - Menu121
    - Menu122
  - Menu13

Når jeg klikke på menu 1 skal alle under menuer lukkes ned, men det er kun den næste menue i heirakiet der bliver lukekt, hvordan kan jeg gøre noget ved det :)