title: How to use onload even of an iframe programmatically with js?
body: <p>I have this iframe I create with js, this is the code I have so far:</p>
  
  <pre><code>&lt;script&gt;
  function loadIframe(url) {
      ifr = document.createElement("IFRAME");
      ifr.setAttribute("src", url);
      ifr.style.width = "800px";
      ifr.style.height = "600px";
      document.body.appendChild(ifr);
      ifr.onload = ready();
  } 
  
  function ready() { alert("ready") };
  
  window.onload = function () {
      loadIframe("http://www.wallpaperpimper.com/wallpaper/Landscape/Ocean/Big-wave-1-S79KZQKBWP-1600x1200.jpg");
  }
  &lt;/script&gt;
  </code></pre>
  
  <p>The iframe gets created but the ready() funcion fires before the iframe loads the content, what I basically wants to do is:</p>
  
  <pre><code>&lt;iframe onload="ready()" src="http://www.wallpaperpimper.com/wallpaper/Landscape/Ocean/Big-wave-1-S79KZQKBWP-1600x1200.jpg"&gt;&lt;/iframe&gt;
  </code></pre>
  
  <p>That works fine, the ready() function fires once the iframe content is loaded, but I want to do it all from js.</p>
  
  <p>I can't use onload inside the body on the pages loaded into the iframe because I don't own them.</p>
  
  <p>How should I set the onload event?</p>