title: How to write a loop in jQuery which waits for each function to complete before continuing the loop
body: <p>Please forgive me if this is an obvious one.</p>
  
  <p>I have an unknown amount of elements on a page, which I need to loop through one at a time and do stuff to. However, I need the loop to pause until the functions used on the elements have completed, and then continue on to the next iteration.</p>
  
  <p>I tried doing this in a $.each loop, but it fired off the commands far to quickly and finished without waiting for them to complete.</p>
  
  <p>Any ideas? </p>
  
  <pre><code>$('elem').each(function(){
      $(this).fadeIn().wait(5000).fadeOut();
  });
  </code></pre>
  
  <p>This is what I have, very simple. 
  I got the wait() function from here: <a href="http://docs.jquery.com/Cookbook/wait" rel="noreferrer">jquery cookbook site</a>.</p>
  
  <p>Problem is, the loop <em>doesnt</em> wait - the actual command works as intended, it's just that they all go off at once.</p>
  
  <p>Any help appreciated, thanks.</p>
  
  <p>EDIT: After this is executed, I may want to then execute the loop again, so that the list of elems will be faded in / out again in sequence</p>
  
  <p>EDIT2: Have since gotten the 1.4.2 jQuery lib, was using 1.3.2, hence the custom wait() function. Now using delay() as mentioned by lobstrosity.
  Managed to cobble together something close to what I need from his answer, thanks lobstrosity :) .</p>