定时器for循环更换图片颜色

比如2秒过后，2变为红色，其它为蓝色，
4秒过后，3为红色，其它为蓝色，一直到100停止，
图片说明

 <!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <script type="text/javascript" src="jquery-3.0.0.min.js"></script>
    <style>
        #box div {
            width: 100px;
            height: 100px;
            margin: 5px;;
        }

        .red {
            background-color: red;
        }

        .blue {
            background-color: blue;
        }
    </style>
</head>
<body>
<div id="box">
    <div class="red"></div>
    <div class="blue"></div>
    <div class="blue"></div>
    <div class="blue"></div>
</div>
</body>
<script>
    $(function () {
        var count = 0;
        var t = setInterval(function () {
            console.log(count);
            if (count == 3) {
                t = window.clearInterval(t);
                return;
            }
            var $redDiv = $("#box").find(".red");
            $redDiv.next().removeClass("blue").addClass("red");
            $redDiv.removeClass("red").addClass("blue");
            count++;
        }, 2000);
    });
</script>
</html>

这就是一个走马灯的效果。假如这是四个div; 一开始第一个div背景变红其他蓝， 2秒过后，第二变红，其他变蓝。
你可以把这四个div的id弄成相似的例如，div1,div2,div3，div4。把后面的1，2，3,4弄成一个变量,最大为4。默认
第一个div1变红，过两秒过，div后面的变量加1，变量超过4，赋值为1