title: Script within iframe not working
body: <p>I'm loading iframe like this</p>
  
  <pre><code>var fw = 600;
  var fh = 300;
  var left = (window.screen.width-fw)/2;
  var top = (window.screen.height-fh)/2;
  $.ajax('/app/ardeal/check_ardeals.htm', {
      data: {hookpoint: _hookpoint, lookupid: _lookupid},
      dataType: 'json',
      success: function(res){
          if(res.status == "success"){
              $('body').append('&lt;div class="fancybox-overlay fancybox-overlay-fixed" style="width: auto; height: auto; display: block;"&gt;' +
                  '&lt;div id="ard-container" style="visibility: visible; position: absolute; margin: auto; z-index: 99999; ' +
                  'overflow: hidden; background-color: #efefef; width: '+fw+'px; top: '+top+'px; left: '+
                  left+'px; display: block; background-position: initial initial; background-repeat: initial initial;"&gt;' +
                  '&lt;iframe id="ardeal-frame" scrolling="no" style="width: 100%; height: 100%; background-color: transparent;"' +
                  'src="/app/ardeal/get_ardeal.html?lookupid='+_lookupid+'&amp;hookpoint='+_hookpoint+'" height=100%&gt;&lt;/iframe&gt;&lt;/div&gt;&lt;/div&gt;');
          }
      },
      error: function(xhr){
          //do nothing. Ignore.
      }
  });
  </code></pre>
  
  <p>And here is my iframe content</p>
  
  <pre><code>    &lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;body&gt;
  &lt;a href="#" id="skip_reward"&gt;No. Thank You.&lt;/a&gt;
      &lt;script type="text/javascript"&gt;
          var jQuery = window.parent.jQuery;
          var $ = jQuery;
          window.onload = function(){
              window.parent.console.log("In iframe load");
          }
          $(document).ready(function(){
              window.parent.console.log("In iframe ready");
              $('#skip_reward').on('click', function(ev){
                  ev.preventDefault();
                  alert("Click within iframe");
              });
          })
      &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I see 'in iframe load' and 'in iframe  ready' printed in console. (Weird thing is twice. Any Ideas?). But my event is not getting bound. and when I click the link no alert is shown. How do I bind events to the elements inside the iframe from the script within the iframe?</p>