I have a basic website nav layout that looks like this:

    <li class="folder parent_folder">
<a href="#">Some Folder</a>
<ul class="submenu">
    <li class="file"><a href="#">An awesome file</a></li>
    <li class="file"><a href="#">An awesome file</a></li>
    <li class="file"><a href="#">An awesome file</a></li>
    <li class="file"><a href="#">An awesome file</a></li>
    <li class="file"><a href="#">An awesome file</a></li>
    <li class="file"><a href="#">An awesome file</a></li>
</ul>

I have several of these throughout the site's page. Using jquery, I'm trying to make it so that when you click "li.parent_folder" "ul.submenu" disappears and then reappears when you click "li.parent_folder" again. I can get it to do this but I have a problem. When I click on the "li.parent_folder" all the "ul.submenu" disapear instead of just the one that is the child of it.

What would be the correct jquery code to accomplish this? (Oh, I'm using jquery ui also in this project

What I have right now is this:

$('li.parent_folder').click(function() { $('li.parent_folder > ul.submenu').hide(); });