¿Qué tal gente?, Estoy haciendo un script de un menu utilizando listas, la idea es que sean desplegables con slideup/down.

El problema que tengo es que cuando le doy "click" a un "a" dentro del ul li interno oculta su ul padre. Probee con ":first", ".first()", ":first-child", pero me da problemas. Me imagino se podría soluciar con clases, pero la idea es sin la utilización de clases/id interno.

Espero haberme dado a entender.

Html:

Código HTML :

<ul id="menu">
   <li>
       <a href="#">Menu 1</a>
       <ul>
            <li><a href="#">Sub Menu 1</a></li>
            <li><a href="#">Sub Menu 2</a></li>
            <li><a href="#">Sub Menu 3</a></li>
        </ul>
    </li>
    <li>
       <a href="#">Menu 2</a>
       <ul>
            <li><a href="#">Sub Menu 1</a></li>
            <li><a href="#">Sub Menu 2</a></li>
            <li><a href="#">Sub Menu 3</a></li>
        </ul>
    </li>
    <li><a href="#">Menu 3</a></li>
</ul>


Javascript:

Código Javascript :

function submenu(id) {
   var div = "#"+id;
   $("ul"+div+" li a").each(function () {
      $(this).click(function() {
         var li = $(this).parent();      
         $("ul"+div+" li ul").each(function () {   $(this).slideUp("fast");   });
         if(li.children("ul").is(":visible")) { 
            li.children("ul").slideUp("fast");
         } else { 
            li.children("ul").slideDown("fast"); 
         }
         return false;
      });
   });
}

$(document).ready(function(){   submenu("menu");   });


Espero puedan darme una ayuda :D.

Gracias