隐藏活动菜单项的下拉列表

I am trying to do something like finance.yahoo.com's menu which stops it's drop down at active menu item. I have already applied jQuery to add addclass() to add .active class but now I just want to stop my drop down at active class.

Where I tried this code but not works

$('#menu > ul > li > a.active').parent('div').hide();

Use closest() instead of parent() as div is not direct parent of a. closest will look first element that matches the selector by testing the element itself and traversing up through its ancestors in the DOM tree

$('#menu > ul > li > a.active').closest('div').hide();

Bind to .mouseleave() event smth. similar to

$('.main_menu_container').mouseleave( function () {
    $(this).children('.submenu').hide();
});