[jQuery] simple accordion problem

[mojoeJohn]

i'm trying to write my own accordion script.

things are almost done, but im having one problem.

here is the layout:

<ul id="links">
      <li><a href="#">Link Head
             <li><a href="#"></a>Sub Link</li>
             <li><a href="#"></a>Sub Link</li>
             <li><a href="#"></a>Sub Link</li>
             <li><a href="#"></a>Sub Link</li>
           </a>
     </li>
      <li><a href="#">Link Head
             <li><a href="#"></a>Sub Link</li>
             <li><a href="#"></a>Sub Link</li>
             <li><a href="#"></a>Sub Link</li>
             <li><a href="#"></a>Sub Link</li>
           </a>
     </li>
</ul>

i have more Link heads but you get the idea. the problem i'm having is
that i can't hover over the sub links without its parent closing and
then reopening it first.

i want the link head to open and remain open while i hover over the
sublinks. i just don't know how to do that.

here's the code so far:

#links li a is the Link head from the diagram above
#links li ul li are the sub links from the diagram above

$(document).ready(function(){
    $("#links li a").hover(
        function()  {
                $(this).siblings("#links li ul li").slideDown("slow");
        },
        function()  {
                $(this).siblings("#links li ul li").slideUp("slow");
        });
        $("#links li ul li").hover(
        function()  {
                $(this).parent("#links li ul li").slideDown("slow");
        },
        function()  {
                $(this).parent("#links li ul li").slideDown("slow");
        });
});