jQuery выбирает соседний элемент

Question

<li>
    <a class="handle" href="abc.htm">TopLink</a> 
    <ul class="container"> 
        <li> 
            <a href="xyz.htm">SubLink1</a> 
        </li>       
    </ul> 
</li>

При нажатии на TopLink (class = "handle");

Вопрос: как написать селектор jQuery таким образом, чтобы выбрать ul class = "container" всякий раз, когда я нажимаю на TopLink

Нечто подобное;$ (this). (Получить следующий UL с classname = "container")

Answer 1

Если это всегда будет структура вашего HTML, вы можете просто использовать next:

$(".handle").click(function() {
    var ul = $(this).next();
});

Если между ссылкой и ul могут быть элементы, вы можете использовать siblings, чтобы получить все элементы, соответствующие селектору:

$(".handle").click(function() {
    var uls = $(this).siblings("ul.container");
});

Хотя это также получило бы предшествующих братьев и сестер. Чтобы просто получить следующих братьев и сестер, вы можете использовать nextAll:

$(".handle").click(function() {
    var uls = $(this).nextAll("ul.container");

    //You can then use `.eq(0)` to get the closest matching sibling:
    var sibling = uls.eq(0);
});