How to load external html into a div?

Question

I created this little code using jquery to load an external HTML file into my div, but it doesn’t work, I am running out of ideas. Any other jquery code works well. Any help appreciated:

<div id="zaladuj"> load external html file </div> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> $('#zaladuj').click(function () { $(this).load('s1.htm'); }); </script> 

Answer 1

You need to wrap your code in jQuery.ready () , since you need to wait for the DOM to fully load.

 <script type="text/javascript"> $(document).ready(function(){ $('#zaladuj').click(function () { $(this).load('s1.htm'); }); }); </script> 

Answer 2

 <script type="text/javascript"> $('#zaladuj').click(function () { $.ajax({ context: this, dataType : "html", url : "s1.htm", success : function(results) { $(this).html(results); } }); }); </script>