title: Adding images to dom, then wait for them to load
body: <p>This is a simple question..</p>
  
  <p>I get a playlist, and then I want to load each image into the dom * there are videos to.</p>
  
  <p>So after all the media has finished loading, I want to be able to call some function. </p>
  
  <p>But in the case below the part <code>console.log("loaded + images")</code> gets called immediately because the DOM was loaded, and after that the images gets added. How would I do it so that it will tell me when all those images were loaded ?</p>
  
  <pre><code>     &lt;script type="text/javascript"&gt;
              _.each(playlist, function(el) {
                  $(".hidden").append("&lt;img src='"+ el.path +"''&gt;")
              });
      &lt;/script&gt;
      &lt;script type="text/javascript"&gt;
          $(window).ready(function() {
              console.log("loaded + images")
          });
      &lt;/script&gt;
  </code></pre>