Q:

content().find() not working on dynamically inserted url to an iframe

I have to double click on submit to get code working after I insert dynamic url to an iframe. It looks like it sets the url in the first click and executes the code on the second.
Code works fine if url is pre inserted there.
Below is the code:
$('#search').on('click', 'button', function(){
    var url = $('#url').val();
    $('#url1').attr('src', url);

    var pageLinks = $('#url1').contents().find('#para a');
    alert(pageLinks[1]);
});

HTML
<div id="search">
    <input type="text" id="url" placeholder="Enter URL" value="" />
    <button type="button" id="start">START</button>
</div>
<iframe id="url1" style="width:49%;" src="" height="200" width="300"></iframe>

url page in iframe has tags like:
<p id="para"><a class="alink" href="page-1.php" target="_blank">Link</a></p>

This code works but on double click, while I am not able to figure out to do it in a single click.

A:

After few hours of research I've found the solution.
After dynamically placing url in iframe, it needed to be reloaded.
$('#search').on('click', 'button', function(){
    var url = $('#url').val();
    $('#url1').attr('src', url);

    $('#url1').on('load', function () {
        var pageLinks = $('#url1').contents().find('#para a');
        alert(pageLinks[1]);
    });
});

