Jquery выбрать следующий элемент

Question

У меня есть следующая структура меню.

<li class="menu-422"><a href="item-1" title="">Item 1</a></li>
<li class="menu-444"><a href="item-2" title="">Item 2</a></li>
<li class="menu-449"><a href="item-3" title="">Item 3</a></li>
<li class="menu-452"><a href="item-4" title="">Item 4</a></li>

В этой структуре элементы (a-tag) имеют фон. Я хочу изменить фон следующего элемента при наведении курсора. Если я перехожу к пункту 2, я хочу изменить фон элемента 3. Я пробовал его с помощью jQuery, но не нашел соответствующего кода.

jQuery("#mymenu li a").hover(function() {
  jQuery(this).next("li a").css('background', 'none');
}

Я пробовал использовать nextAll с полным путем выбора, но я не могу выбрать следующий элемент.

Answer 1

При наведении курсора вы хотите подняться к родителю li, затем использовать next(), чтобы перейти к следующему li, затем find('a') внутри этого li:

$("#mymenu li a").hover(function() {
    $(this).parent().next().find("a").css('background', 'none');
});

Answer 2

Вместо выбора якорей вы можете просто выбрать li и прикрепить к нему событие hover. А при наведении курсора просто используйте метод next, чтобы получить следующий элемент li и изменить фон. Я предполагаю, что у вас нет заданного фона для якоря, потому что я меняю фон элемента li.

$("#mymenu li").hover(function() {
    $(this).next().css('background', 'none');
    //If you want to change the background of anchor try this
    //$(this).next().find('a').css('background', 'none');
}