Sous-menu d'un sous-menu

Bonjour à tous,
J'ai trouvé ce script Javascript qui me convient à merveille pour un menu avec sous-menus mais mon gros souci est d'ajouter un sous-menu supplémentaire (ou sous-sous-menu si vous voulez -> nommé ici middlemenu). Je me casse la tête dessus depuis hier et rien ne marche, je n'ai que des notions en JS, donc si quelqu'un de doué dans cette branche passe par là ...

Voici mon menu

<div id="menuu">
    <div class="menuu" id="menu1" onclick="afficheMenu(this)">
        <a href="#">ACCUEIL</a>
    </div>  
    <div class="menuu" id="menu2" onclick="afficheMenu(this)">
        <a href="#">AUTEUR</a>
    </div>
    <div id="sousmenu2" style="display:none">
        <div class="sousmenu">
            <a href="#">BIOGRAPHIE</a>
        </div>
        <div class="sousmenu">
            <a href="#">BIBLIOGRAPHIE</a>
        </div>
        <div class="sousmenu">
            <a href="#">BIBLIO DETAILLEE</a>
        </div>
    </div>
    <div class="menuu" id="menu3" onclick="afficheMenu(this)">
        <a href="#">EDITION</a>
    </div>
    <div id="sousmenu3" style="display:none">
        <div class="middlemenu" id="menu4" onclick="afficheMenu(this)">
            <a href="#">MAISON 1</a>
        </div>
                <div id="sousmenu4" style="display:none">
        <div class="sousmenu">
            <a href="http://www.francisdannemark.be/fdk_bio.php">LITTERATURE FRANCOPHONE</a>
        </div>
        <div class="sousmenu">
            <a href="http://www.francisdannemark.be/fdk_biblio_detail.php">LITTERATURE ETRANGERE</a>
        </div>
    </div>
        <div class="middlemenu">
            <a href="">MAISON 2</a>
        </div>
        <div class="middlemenu">
            <a href="#">MAISON 3</a>
        </div>
    </div>
    <div class="menuu" id="menu5" onclick="afficheMenu(this)">
        <a href="#">ASBL LIVRES</a>
    </div>
    <div id="sousmenu5" style="display:none">
        <div class="sousmenu">
            <a href="#">A PROPOS</a>
        </div>
        <div class="sousmenu">
            <a href="#">PARUTIONS</a>
        </div>
        <div class="sousmenu">
            <a href="#">PHOTOS</a>
        </div>
    </div>
    <div class="menuu" id="menu6" onclick="afficheMenu(this)">
        <a href="#">CONTACT</a>
    </div>
    <div class="menuu" id="menu7" onclick="afficheMenu(this)">
        <a href="#">NEWSLETTER</a>
    </div>
</div>

Et mon code JS

function afficheMenu(obj){

    var idMenu     = obj.id;
    var idSousMenu = 'sous' + idMenu;
    var sousMenu   = document.getElementById(idSousMenu);

    /*****************************************************/
    /** on cache tous les sous-menus pour n'afficher    **/
    /** que celui dont le menu correspondant est cliqué **/
    /** où 5 correspond au nombre de sous-menus         **/
    /*****************************************************/
    for(var i = 1; i <= 5; i++){
        if(document.getElementById('sousmenu' + i) && document.getElementById('sousmenu' + i) != sousMenu){
            document.getElementById('sousmenu' + i).style.display = "none";
        }
    }

    if(sousMenu){
        //alert(sousMenu.style.display);
        if(sousMenu.style.display == "block"){
            sousMenu.style.display = "none";
        }
        else{
            sousMenu.style.display = "block";
        }
    }

}

Un tout grand merci