title: How can I detect whether an iframe is loaded?
body: <p>I am trying to check whether an iframe has loaded after the user clicks a button.</p>
  
  <p>I have</p>
  
  <pre><code>$('#MainPopupIframe').load(function(){
      console.log('load the iframe')
      //the console won't show anything even if the iframe is loaded.
  })
  </code></pre>
  
  <p>HTML</p>
  
  <pre><code>&lt;button id='click'&gt;click me&lt;/button&gt;
  
  //the iframe is created after the user clicks the button.
  &lt;iframe id='MainPopupIframe' src='http://...' /&gt;...&lt;/iframe&gt;
  </code></pre>
  
  <p>Any suggestions?</p>
  
  <p>By the way, my iframe is created dynamically. It doesn’t load with the initial page load.</p>