Running javascript in page that is loaded with jQuery Ajax

Question

I have a function that loads parts of other pages into my div #ajaxloadconent, here is the function:

$('#ajaxloadcontent').load(url+' #ajaxloadcontent');

However, the problem is that I am unable to run javascript on the page that I load, while using this function. I simply want to run this:

<script type="text/javascript">
document.title = 'PearlSquirrel About';
</script>

When the data is loaded through .load(). The script is contained on the page that I load, so I do not want to modify the .load() function that I use. If anyone knows how to fix this, then help would be greatly appreciated. I can also provide further information if necessary.

• user400654: Is the javascript located inside of the #ajaxloadcontent element?
• Eggo: Yes, it is. It is located directly after the div is set.
• user400654: directly after is not the same as inside. If it is after, it will not be pulled in.
• Eggo: What I meant to say is that it is inside the set div, so yes it is inside. I have made sure of that.
• user400654: i would go with Eran's answer and move to using $.ajax to give you more control over it. simply replace his alert(data) with $(data).find("#ajaxloadedcontent").appendTo("#ajaxloadcontent"). replace .find with .filter if #ajaxloadedcontent is a direct child of the body or if it is the only html in the document.

Answer 1

Try to use this

$.ajax({
 url: url,
 dataType: 'html',
 success: function(data) {
 //Do something with the data e.g.
 $(data).find("#ajaxloadedcontent").appendTo("#ajaxloadcontent");
 }
});

from the jQuery docs:

"html": Returns HTML as plain text; included script tags are evaluated when inserted in the DOM.

Or you can use http://api.jquery.com/jQuery.getScript if you seperate your script to a standalone js file

• Eggo: I was able to implement this code, along with other snippets, to make it work; thanks for the help.