jQuery - 使用段落中的next（）添加和刪除類

Question

我有一個文檔，它有很多跨度，其中有類.highlight。第一個選擇的項目也有.currentItem，表示它是當前選擇的項目。我希望能夠在用戶點擊按鈕時瀏覽到下一個突出顯示的項目。這裏的功能，最好的，因爲我可以告訴大家，應該工作：

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

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

$活躍被正確設定，它的從中取出CURRENTITEM類。但是，$接下來往往不起作用，因爲下一個突出顯示的項目位於另一個div或段落中。 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/