How to get a click event in an iframe trigger an alert in parent frame
<p>I have several embedded <code>iframes</code> on my page and I'm looking for a click event inside the <code>ifram</code>e to trigger an alert on the parent frame. (both iframe &amp; parent frame are same domain).</p>

<p>iFrame HTML element (the iframe has a class of <code>class="iframe1"</code>:</p>

<pre><code>&lt;a class="button" href="#"&gt;Trigger Parent Frame Alert&lt;/a&gt;
</code></pre>

<p>iFrame jQuery:</p>

<pre><code>$(document).ready(function() {  
  $('.button').click(function() {
    window.parent.triggerAlert();
  });
});
</code></pre>

<p>Parent Frame jQuery:</p>

<pre><code>$(document).ready(function() {
function triggerAlert(){
    alert('iFrame button has been clicked');
  }
});
</code></pre>

<p>I'm thinking my parent frame function is incomplete - and not entirely sure the iframe can communicate with the parent DOM?</p>

<p>I have previously tried this alternative with no luck in the parent frame:</p>

<pre><code>$('.iframe1').contents().find('.button').click(function () {
  alert("iFrame button has been clicked");
});
</code></pre>
