jQuery - 단락에서 next()를 사용하여 클래스 추가 및 제거

Question

문서가 있고 클래스에 .highlight라는 다양한 범위가 있습니다. 첫 번째로 선택한 항목의 .currentItem도 현재 선택되어 있습니다. 사용자가 버튼을 클릭하면 다음 강조 표시된 항목을 탐색 할 수 있기를 원합니다.

function goNextHighlight() { 
    var $active = $('.currentItem'); 
    var $next = $('.currentItem').next('.highlight'); 

    $active.removeClass('currentItem'); 
    $next.addClass('currentItem'); 
} 

가 활성 $가 제대로 설정되고 있으며, 그것에서 currentItem 클래스를 제거하는 것 : 여기 내가 말할 수있는 최선의, 작업을해야하는 함수입니다. 그러나 다음에 강조 표시된 항목이 다른 div 또는 단락에 있기 때문에 $ next는 자주 작동하지 않습니다. Here's a jsfiddle that shows the problem. 다음 버튼을 두 번 클릭하면 처음 버튼이 작동하지만 두 번째 버튼은 작동하지 않는 것을 볼 수 있습니다.

문서의 위치에 관계없이 다음 일치하는 .highlight로 이동하도록하려면 어떻게해야합니까?

Answer 1

var $next = $('.highlight').eq($active.index('.highlight')+1); 

예 : http://jsfiddle.net/Paulpro/qjsjt/1/