Jquery chọn phần tử tiếp theo

Question

Tôi có cấu trúc menu tiếp theo.

<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> 

Trong cấu trúc này, các mục (a-tag) có nền. Tôi muốn thay đổi nền của mục tiếp theo trên sự kiện di chuột. Nếu tôi vượt qua mục 2, tôi muốn thay đổi nền của mục 3. Tôi đã thử nó với jQuery, nhưng tôi không tìm thấy mã thích hợp.

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

Tôi đã thử nó với nextAll, với đầy đủ đường dẫn bộ chọn, nhưng tôi không thể chọn yếu tố tiếp theo.

Answer 1

Khi di chuột, bạn muốn đi đến phụ huynh li, sau đó sử dụng next() để đến tiếp theo li, sau đó find('a') bên trong mà li:

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

Answer 2

Thay vì chọn các neo bạn chỉ có thể chọn li và đính kèm sự kiện hover trên đó. Và trong di chuột chỉ cần sử dụng phương thức next để nhận phần tử li tiếp theo và thay đổi nền. Tôi giả sử bạn không có nền thiết lập để neo bởi vì tôi đang thay đổi nền của phần tử 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'); 
}