jquery - JSやjQueryで要素を1つずつ表示する

Question

いくつかの DIV があり、それらを 1 つずつ表示したいと考えています。

まず、それらはすべてdisplay:none;CSS である必要があります。次に、jQueryスクリプトが必要ですが、書き方がわかりません。

一度に表示できる要素は 1 つだけで、遅延は約 2 秒です。シーケンスは次のようになります。

1. 2秒間要素なし
2. 最初の要素が 2 秒間表示されます。
3. 要素が 2 秒間表示されない
4. 2 番目の要素が 2 秒間表示されます
5. など... + ループ

ありがとう！

ここに私がこれまでに行ったことのリンクがあります。それを行うのはエレガントな方法ではありません。また、最後の要素がオンになった後はループ停止しません。 http://jsbin.com/uwubah/7/

HTML:

  <div class="dezute">dezute</div>
  <div class="kubikas">kubikas</div>
  <div class="zirkles">zirkles</div>
  <div class="telefonas">telefonas</div>
  <div class="izoliacija">izoliacija</div>
  <div class="dainuoja">dainuoja</div>

CSS:

.dezute, .kubikas, .zirkles, .telefonas, .izoliacija, .dainuoja{
  display: none;
}

jQ:

$(document).ready(function() { 
    setTimeout(function() { 
        $('.dezute').fadeIn(); 
 }, 2000); 
});

$(document).ready(function() { 
    setTimeout(function() { 
        $('.dezute').fadeOut();
        $('.kubikas').fadeIn();
 }, 4000); 
});

$(document).ready(function() { 
    setTimeout(function() { 
        $('.dezute').fadeOut();
        $('.kubikas').fadeOut();
        $('.zirkles').fadeIn();
 }, 6000); 
});

$(document).ready(function() { 
    setTimeout(function() { 
        $('.dezute').fadeOut();
        $('.kubikas').fadeOut();
        $('.zirkles').fadeOut();
        $('.telefonas').fadeIn();
 }, 8000); 
});

$(document).ready(function() { 
    setTimeout(function() { 
        $('.dezute').fadeOut();
        $('.kubikas').fadeOut();
        $('.zirkles').fadeOut();
        $('.telefonas').fadeOut();
        $('.izoliacija').fadeIn();
 }, 10000); 
});

$(document).ready(function() { 
    setTimeout(function() { 
        $('.dezute').fadeOut();
        $('.kubikas').fadeOut();
        $('.zirkles').fadeOut();
        $('.telefonas').fadeOut();
        $('.izoliacija').fadeOut();
        $('.dainuoja').fadeIn();
 }, 12000); 
});