jquery - 循环使用按数字顺序排列的 id 名称的 div？

Question

我有 4 个 div，其 ID 名称分别为 type1、type2、type3 和 type4。我需要某种 jquery 的帮助，它为第一个 div 提供绿色背景，然后在 2 秒后下一个 div 获得绿色背景，第一个返回正常背景颜色，依此类推。我需要循环永远持续下去。

<div id="type1">
<p>Hey</p>
</div>

<div id="type2">
<p>Hello></p>
</div>

<div id="type3">
<p>Hey again</p>
</div>

<div id="type4">
<p>Hello again</p>
</div>

Answer 1

为了完整起见，我想指出这可以在没有 Javascript 的情况下完成

使用 css 动画。

FIDDLE

标记

<div class="animated"></div>
<div>
<p>Hey</p>
</div>

<div>
<p>Hello></p>
</div>

<div>
<p>Hey again</p>
</div>

<div>
<p>Hello again</p>
</div>

(相关)CSS

.animated
{
    position:absolute;
    top:0;
    background:green;
    z-index:-1;
    animation: move 8s steps(4) infinite;    
}

@keyframes move {
  from { top: 0; }
  to   { top: 400px; }
}