I am trying to load some content into a page using Ajax. The html that is loaded contains some javascript code. Even though the code is wrapped within $(document).ready
, it gets executed before the content is inserted into the document, because the parent document's Dom is ready by the time the content is loaded.
How can I defer the execution of the code, until the content has been inserted into the document. Here is the html that I am trying to load (this is the code for openid-selector)
<script type="text/javascript" src="/js/openid-jquery.js"></script>
<script type="text/javascript">
$(document).ready(function() {
alert('ajax-html');
openid.init('openid_identifier');
});
</script>
<!-- Simple OpenID Selector -->
<form action="try_auth.php" method="get" id="openid_form">
<input type="hidden" name="action" value="verify" />
<fieldset>
<legend>Sign-in or Create New Account</legend>
<div id="openid_choice">
<p>Please click your account provider:</p>
<div id="openid_btns"></div>
</div>
<div id="openid_input_area">
<input id="openid_identifier" name="openid_identifier" type="text" value="http://www.joycebabu.com" />
<input id="openid_submit" type="submit" value="Sign-In"/>
</div>
</fieldset>
</form>
Update : Removed the noscript tag