jQuery中无限的每个()循环？

Question

我有几个单独的标题:

<h3 class="ads">First</h3>

<h3 class="ads">Second</h3>

<h3 class="ads">Third</h3> 

我希望能够连续循环它们,将文本从黑色更改为红色,然后在下一个标题更改为红色后再将其更改为黑色.

这是我到目前为止所做的:它只运行一次,但我不能让它成功地重新循环:

$('.ads').each(function(i) { 
    var el=$(this);
    setTimeout(function() {
        el.prevAll('.ads').css('color','black');
        el.css('color', 'red');
    }, i * 3000); 
});

我希望能够手动设置每次更改之间等待的时间,因此解释也会有很大帮助!

这是jsFiddle.

Answer 1

这是一种略有不同的方法.

jsFiddle演示

var $headings = $('.ads'),
    $length = $headings.length,
    i = 0;

setInterval(function() {
    $headings.css('color','black');
    $headings.eq(i).css('color', 'red');
    i = (i + 1) % $length;
}, 3000);