Используя JQuery, как показать и скрыть событие onClick другого div

Я хотел бы показать div на основе события Onclick ссылки.

Первый клик - Показать div1
Второй щелчок - скрыть оставшиеся div и показать div2
Третий щелчок - скрыть оставшиеся div и показать div3
Четвертый щелчок - скрыть оставшиеся элементы div и показать div1 => повторить цикл и продолжить ..

Код следует:

<div class="toggle_button">
      <a href="javascript:void(0);" id="toggle_value">Toggle</a>
</div>


<div id='div1' style="display:none;"> 
  <!-- content -->
</div>

<div id='div2' style="display:none;"> 
  <!-- content -->
</div>

<div id='div3' style="display:none;"> 
  <!-- content -->
</div>

Код Jquery:

$(document).ready(function() {
        $("#toggle_value").click(function(){
           $("#div1").show("fast");
           $("#div2").show("fast");
           $("#div3").show("fast");
        });
});

Приведенный выше код показывает все div-ы при первом клике, но он должен показывать div1 при первом клике, как уже упоминалось.

Ответы на вопрос(12)

Ваш ответ на вопрос