添加动态自动播放到ul li

Question

如何每隔30秒将活动的第一班li添加到另一个li？

我使用以下jQuery来自动播放li：

setInterval(function () {
        moveRight();
       }, 3000);
        function moveRight() {
        $('#slider ul').animate({
            left: - slideWidth
        }, 200, function () {
            $('#slider ul li:first-child').appendTo('#slider ul');
            $('#slider ul').css('left', '');
        });
    };

如何将active课程添加到li

我的HTML：

<ul>
    <li>SLIDE 1</li>
    <li style="background: #aaa;">SLIDE 2</li>
    <li>SLIDE 3</li>
    <li style="background: #aaa;">SLIDE 4</li>
</ul> 

Answer 1

Check this fiddle

setInterval(function () {
    moveRight();
   }, 3000);
    function moveRight() {
        var len=$('li');
        var i=1;
        $('li').each(function(){
            i++;
             if($(this).attr('class')=="active")
             {
                 $(this).next('li').addClass('active');
                 $(this).removeClass('active');
                 return false;
             }
            if(len.length==i)
            {
                $('li:nth-child(1)').addClass('active');
            }
        });
}