open and close submenus on click Jquery

Question

I have a main menu that will display the submenus with a click event in jquery (client wanted to be click instead hover) so I got it working however I still can\'t figure ou

Answer 1

Just Add this line into your code

$('#MainMenu > li').not(this).find('ul').slideUp();

FULL CODE

$('#MainMenu').find('> li').click(function() {
    $('#MainMenu > li').not(this).find('ul').slideUp();
    $(this).find('ul').stop(true, true).slideToggle(400);
    return false;
});​

Check Fiddle

Answer 2

Try something like this

$(function() {
    $('#MainMenu > li').click(function(e) { // limit click to children of mainmenue
        var $el = $('ul',this); // element to toggle
        $('#MainMenu > li > ul').not($el).slideUp(); // slide up other elements
        $el.stop(true, true).slideToggle(400); // toggle element
        return false;
    });
    $('#MainMenu > li > ul > li').click(function(e) {
        e.stopPropagation();  // stop events from bubbling from sub menu clicks
    });
});​

http://jsfiddle.net/Ssu32/