Jquery动画问题animate,为何只能动一下？？？

Question

$(function(){
var i=0;
setInterval(
function(){
alert($(".move").eq(i).html());
$(".move").eq(i).animate({right:"100px"},3000);
$(".move").eq(i+1).animate({right:"100px"},3000);
++i;
},3000
);
});
<div style="width: 100px;height: 100px;position: absolute;z-index: 1;overflow: hidden;display: inline">
     <div style="width: 1000px;position: relative;" id="dd" >
     <div style="width: 100px;height: 100px;background-color: blue;position: relative;display: inline;z-index: 1; " class="move">1
     </div>
     <div style="width: 100px;height: 100px;background-color: red;position: relative; display: inline;z-index: 2;" class="move">2
     </div>
     <div style="width: 100px;height: 100px;background-color: yellow;position: relative; display: inline;z-index: 3;" class="move">3
     </div>
     <div style="width: 100px;height: 100px;background-color: green;position: relative; display: inline;z-index: 4;" class="move">4
     </div>
     <div style="width: 100px;height: 100px;background-color: pink;position: relative; display: inline;z-index: 5;" class="move">5
     </div>
     </div>
     </div>jQuery

Answer 1

$(function(){
var i=0;
setInterval(
function(){
alert($(".move").eq(i).html());
$(".move").eq(i).animate({right:"+=100px"},3000);
$(".move").eq(i+1).animate({right:"+=100px"},3000);
++i;
},3000
);
});