jquery loadBefore or loadAfter

Question

I was wondering if anyone knows of an efficient pattern for dynamically loading html. jQuery's load method allows a developer to load html into a specified element. I would like to insert the html before a certain element. For example

html

<div>
   <div class ="child">
   </div>
</div>

jQuery

 jQuery('div.child').load('ex.html');

Result

 <div>
   <div class ="child">
        <!-- ex.html -->
   </div> 
 </div>

Desired Result

<div>
   <!-- ex.html -->
   <div class ="child">  
   </div> 
 </div>

I know about insertBefore and methods of this nature. But this means I have to download html into one spont and the move it all again into another spot. Does anyone have any good solutions? Thanks

Answer 1

I believe this will give you the proper result:

$GET('ex.html', function(html){
  if(html){
    jQuery('div.child').parent.prepend(html);
 }

});

Answer 2

You don't have to move anything around after the load; you can do something like this:

$('<div/>').insertBefore('.inner').load('/url');

as long as you can live with the div wrapping the loaded content.