Возникла проблема с селекторами

Question

Проблема в том, что я не могу выбрать div внутри div'ов класса 'menuItem'. Я пытался использовать селектор jQuery для выбора по классу и даже по идентификатору, но каждый раз, когда я пытаюсь что-то с ним сделать, например анимацию, ничего не происходит. Есть ли какой-то закон jQuery, о котором я не знаю, который мешает мне сделать это?

$('.menu')
    .hover( function() { 
        $(this).toggleClass('highlighted'); 
    })
    .click(function() {
        $(this).parent().children('.menuItem').children('#wtf').slideDown();
    });

Также пробовал их для click (), но ни один из них не работает ..

$('#wtf').slideDown();
$('.test').slideDown();
$(this).parent().find('.menuItem').each( function() { $(this).slideDown(); } );
$(this).parent().children('.menuItem').children().slideDown();

---

<div class='box'>
    <div>
        <div class='menu'>Resources</div>

        <div class='menuItem'>
            <div ID='wtf' class='test'>Library</div>
            <div>Internet</div>
            <div>Your mom</div>
        </div>
    </div>

    <div>
        <div class='menu'>Products</div>
    </div>

    <div>
        <div class='menu'>Contact</div>
    </div>
</div>

---

body { font-size: 16px; }

.box {
    background: blue; 
    border: 1px; 
    padding: 4 6 4 6; 
    position: absolute; 
    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border: 2px solid;
}

.box div {
    float: left; 
    text-align:center; 
}

.menu {
    background: lightblue;
    width: 105px;
    text-align: center;
    padding: 4 10;
    margin: 1 5;
    font-weight: bold;
    font-family:'Verdana', 'Times', serif; 
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 2px solid gray;
}

.highlighted {
    background: lime;
    color: navy;
}

.menuItem {
    clear: left;
    position: absolute;
    margin-top: 30px;
}

.menuItem div {
    display: none;
    background: lightblue;
    opacity: .7;
    filter: alpha(opacity=.7);
    width: 105px;
    text-align: center;
    padding: 4 10;
    margin: 1 5;
    font-size: 10px;
    font-family: 'Verdana', 'Times', serif; 
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border: 2px solid white;
    clear: left;
}

Answer 1

Вы пробовали?

$(this+' > .menuItem div')

Answer 2

Я применил цвет фона к вашему стилю, а ваш селектор jQuery выбрал неправильно. Я попробовал это, и это изменило цвет фона, но у меня нет CSS для работы визуального объекта slideDown () - вам придется правильно написать свой CSS.

$ (это) .siblings () найти ( "# WTF") CSS ( "цвет фона", "# CCCCCC") slideDown ();...