title: Functions in a for Loop
body: <p>I have some code I am trying to get to iterate over some images in a slider effect. However when I try to call the function from within my for loop it doesn't work. But if I have the call to <code>animateImage</code> function outside of the loop it works fine, but only runs once. How can I get this to run successfully fade in, fade out - loop again- fade in fade out?</p>
  
  <pre><code>$(document).ready(function(){
    function animateImage() {
      $('#mainImage').fadeOut( 5000, function() {
        $(this).fadeIn(5000);
      });
  
      for (var i = 0, limit = 7; i &lt; limit; i++) {
        animateImage();
      }
    }
  </code></pre>