addClass если уль существует (JQuery)

Question

Я строю простой выпадающий список, где я хотел бы добавить класс к родителю, если UL существует:

HTML:

<ul id="menu"> 
    <li><a href="#">Parent 1</a></li> 
    <li><a href="#">Parent 2</a> 
    <ul> 
     <li><a href="#">Sub 2.1</a></li> 
     <li><a href="#">Sub 2.2</a></li> 
    </ul> 
    </li> 
</ul> 

Так что я хотел бы чтобы:

• скрыть все вложенные (ul#menu > li > ul) UL в первоначально
• показать/скрыть вложенные ul по наведению
• addClass «выпадающие» для родителей, которые вложены уль-х

Это не совсем работает, не знаю, почему:

$(function() { 
    $("ul#menu li").hover(function() { 
     $(this).addClass("hover"); 
     $('ul:first', this).css('visibility', 'visible'); 
    }, 
    function() { 
     $(this).removeClass("hover"); 
     $('ul:first', this).css('visibility', 'hidden'); 
    }); 
    $("ul#menu li ul li:has(ul)").find("a:first").addClass("dropdown"); 
}); 

Большое спасибо за вашу помощь!

Answer 1

var ul = $('#menu'); 

if (ul.length) { 
    ul.children('li').hover(function() { 
     $(this).children('ul').show(); 
    }, function() { 
     $(this).children('ul').hide(); 
    }).children('ul').hide().parent().addClass('dropdown'); 
} 

Demo: http://jsbin.com/ofayu

BTW: Вы закрываете <li> тегов неправильно в разметке.

Answer 2

Этот должен сделать трюк (непроверенный):

$('ul#menu > li > ul').each(function() 
{ 
    var list = $(this); 
    list.hide(); 
    list.parent().hover(list.hide, list.show); 
    list.parent().parent().addClass('dropdown'); 
}); 

Answer 3

Вы писали:

$("ul#menu li ul li:has(ul)") 

Учитывая вашу HTML структуру, не это должно быть:

$("ul#menu li:has(ul)")