jQuery如何通过一个小延迟逐个向一个元素添加一个类?

Kas*_*ith 1 each jquery addclass element delay

jQuery如何在单击#button时将一个类逐个添加到元素中,延迟很小?不要为所有元素一次添加类.我想逐个添加.请帮忙.提前致谢.

<ul id="scroll-set">
<li class="  imVisible">Brentwood</li>
<li class="imVisible ">Antioch</li>
<li class=" imVisible">Pittsburg</li>
<li class=" imVisible">Concord</li>
<li class="imVisible ">Walnut Creek</li>
<li class=" imVisible">Danville</li>
<li class=" imVisible">San Ramon</li>

</ul>
<div id="button">
Run Code Online (Sandbox Code Playgroud)

xda*_*azz 14

工作演示.

$('#button').click(function() {
  $('#scroll-set li').each(function(i) {
    var $li = $(this);
    setTimeout(function() {
      $li.addClass('imVisible');
    }, i*100); // delay 100 ms
  });
});
Run Code Online (Sandbox Code Playgroud)


反向版本.

$('#button').click(function() {
  $($('#scroll-set li').get().reverse()).each(function(i) {
    var $li = $(this);
    setTimeout(function() {
      $li.addClass('imVisible');
    }, i*100); // delay 100 ms
  });
});
Run Code Online (Sandbox Code Playgroud)