title: Call function when all of onload events finish inside of jQuery's $.each loop?
body: <p>I'm using jQuery's $.each function to iterate through an array of images and preload them. I'm also using an onload event so that I can do additional functionality once an image has finished loading. How can I know once ALL the images are finished?</p>
  
  <pre><code>var array = ["1.jpg", "2.jpg", "3.jpg", "4.jpg"];
  
  function preloadAndDoStuff(array) {
      $.each(array, function(i, url) {
          var img = new Image();
  
          img.onload = function() {
              /* Some functionality here
              * that is only possible when
              * an image has finished loading */
  
              console.log(img.src + " loaded");
          }
  
          img.src = url;
      });
  }
  
  preloadAndDoStuff(array);
  
  // 1.jpg loaded
  // 2.jpg loaded
  // 3.jpg loaded
  // 4.jpg loaded
  </code></pre>
  
  <p>In my example instead of having X amount of logs I just need one. If it means anything: the array's length will be constantly changing.</p>