jquery - 我如何循环.next()？

Question

我有 3 个具有相同类的 div，我在单击时将“选定”类添加到 NEXT DIV 并将其从上一个类中删除，它工作正常，但我想循环它

目前它从 1 --> 2 --> 3，我希望它循环，3-->1，请帮忙...

HTML

<div id="all">
<div class="section selected">ONE</div>
<div class="section">TWO</div>
<div class="section">THREE</div>
</div>
<br />
<a href="javascript:;" id="button">CLICK</a>

CSS

.selected{background:red}

JS

$('#button').click(function(){
    $('.section.selected').removeClass('selected').next('.section').addClass('selected'); 
});

JS fiddle 链接:http://jsfiddle.net/madhuri2987/KK66g/2/

Answer 1

最简单的方法就是检查 .next() 是否存在，如果不存在，则“选择”第一个。

var $next = $('.section.selected').removeClass('selected').next('.section');
if ($next.length) {
    $next.addClass('selected'); 
}
else {
    $(".section:first").addClass('selected');
}

http://jsfiddle.net/KK66g/3/