jquery - 遅延に基づいて色を適用する

Question

私は一連のliを持っており、各liの間の遅延後に各liの背景色を設定したいと考えています。

例: 1 つの Li が赤く着色されている場合、ある程度の遅延 (800) の後、現在着色されている Li を削除し、次の Li を着色し、残りの Li を処理する必要があります。

HTML

<ul>
    <li>list item 1</li>
    <li>list item 2</li>
    <li>list item 3</li>
    <li>list item 4</li>
    <li>list item 5</li>
  </ul>

jQuery

$('ul').each(function(i, j){
    $(this).eq(i).css('background-color', 'red').delay(1000).removeAttr('style');
});

デモ

私が間違っているところを修正してください。

Answer 1

これを試すことができますhttp://jsfiddle.net/fpYdt/8/：

HTML:

<ul>
    <li class="red">list item 1</li>
    <li>list item 2</li>
    <li>list item 3</li>
    <li>list item 4</li>
    <li>list item 5</li>
</ul>

追加された CSS:

.red {background-color:red}

JQuery:

$(document).ready(function () {
    setInterval(function(){
        var red = $('li.red');
        red.removeClass('red');
        var next = red.next();
        if(next.length > 0)            
            red.next().addClass('red');
        else
            $('li').first().addClass('red');
    },3000);
});