Помогите с меню jQuery

Question

Html:

<ul id="menu">
    <li>Menu 1</li>
    <li>Menu 2
        <ul>
            <li class="submenu">something</li>
        </ul>
    </li>
    <li>Menu 3</li>
</ul>

jQuery:

$('#menu > li:has(.submenu)').hover(function() {
    $(this).children('ul').show().addClass('active');
}, function() {
    $(this).children('ul').hide().removeClass('active');    
});

http://jsfiddle.net/mXTzy/

Теперь, если отображается .submenu, я хочу родительский элемент liиметь класс active (и удаляется при наведении мыши).

Буду признателен за любую помощь с этим.

Большое спасибо

Answer 1

Ладно, понял:

$('#menu > li:has(.submenu)').hover(function() {
    $(this).addClass('active').children('ul').show();
}, function() {
    $(this).removeClass('active').children('ul').hide();    
});

.. хотя и некрасиво.

Answer 2

Вы ищете это?

jsFiddle

$('#menu > li').hover(function() {
    $(this).children('ul').show();
    $(this).addClass('active');
}, function() {
    $(this).children('ul').hide();  
   $(this).removeClass('active');  
});

#meun li { float: left; }
#menu li a { float; left; padding:10px; }
#menu li ul { display: none; }
#menu li.active  { background:#dd0; }

<ul id="menu">
    <li>Menu 1</li>
    <li>Menu 2
        <ul>
            <li class="submenu">something</li>
        </ul>
    </li>
    <li>Menu 3</li>
</ul>

Answer 3

ИДК, если это поможет вам или нет, но ...

1. попробуйте использовать: содержит селектор (http://api.jquery.com/contains-selector/)
2. вы можете использовать toggleClass ( http://api.jquery.com/toggleClass/)