jQuery UI Dialog and IFRAME - with 'on' event handler
<p>On the parent page of my IFRAME I have a jQuery event to detect a click on an element within the IFRAME. Clicking on this link opens up a jQuery UI dialog:</p>

<pre><code>&lt;iframe id="my-iframe" src="page.php"&gt;
    &lt;div class="edit-content"&gt;&lt;/div&gt;
&lt;/iframe&gt;

$('#my-iframe').contents().find('body').on('click', '.edit-content', function(){
    $('#dialog', window.parent.document).dialog();
});
</code></pre>

<p>(the dialog content is stored in #dialog on the parent page)</p>

<p>Now on the dialog itself, I have a link to which I want to attach an 'on' event handler to:</p>

<pre><code>&lt;a href="#" class="edit-link" id="test-1"&gt;Test&lt;/a&gt;

$('#dialog').on('click', $('.edit-link'), function(){
    alert($(this).attr("id"));
    return false;
});
</code></pre>

<p>However this is not returning the ID of the link, instead it is returning "dialog".</p>
