title: jQuery loop an "add class" method with a delay between
body: <p>I am now creating a site including several sections with elements appearing with "cascade" style (one after the other, with a delay between). This is the way I do it:</p>
  
  <pre><code>setTimeout(function(){
           $('nav .icon-hola').toggleClass('colorHigh');      },300);     
        setTimeout(function(){
           $('nav .icon-progra').toggleClass('colorHigh');      },400);          
        setTimeout(function(){
           $('nav .icon-sistemas').toggleClass('colorHigh');      },500);       
        setTimeout(function(){
           $('nav .icon-equipo').toggleClass('colorHigh');       },600);   
              setTimeout(function(){
           $('nav .icon-clases').toggleClass('colorHigh');      },700); 
        setTimeout(function(){
           $('nav .icon-social').toggleClass('colorHigh');      },800);       
        setTimeout(function(){
           $('nav .icon-contacto').toggleClass('colorHigh');       },900);   
  </code></pre>
  
  <p>Is there any way of creating some kind of loop that, in this case, gives every <code>$('nav [class^=icon-]')</code> an <code>.addClass('colorHigh')</code> method every 100 ms?</p>
  
  <p>If there is, is it more reliable to do it by the way I am doing or by the other? Both need same resources or does one of those take more load to apply?</p>