.load() not loading remote HTML properly

.load() not loading remote HTML properly

I searched google and this forum and I couldn't see anyone facing this strange problem: I'm using .load() to refresh a page content from a remote file (in the same server) like so
  1. $('#load_but').click(function(){
  2. $('#content').load('remote.html #content div');
  3. }); 
and here's an example of the code in the remote page 
   
    
    
  1. <div id="content">
    2. 
    
  2.       <div id="what_we_do">
    3. 
    
  3.             <p>We do this</p>
    4. 
    
  4.             <p>And this</p>
    5. 
    
  5.             <p>And this</p>
    6. 
    
  6.       </div>
    7. 
    
  7. </div>
    8.

This is generally working. However, when I have a more complex structure like: 

  
    
   
  1. <div id="content">
    2. 
   
  2.       <div id="our_work">
    3. 
   
  3.             <p><span class="prev"> &lt; </span> <span id="s_index">1</span>/<span id="s_total">0</span> <span class="next"> &gt; </span></p>
    4. 
   
  4.             <div id="block">
    5. 
   
  5.                   <div>
    6. 
   
  6.                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce porttitor auctor turpis.</p>
    7. 
   
  7.                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce porttitor auctor turpis.</p>
    8. 
   
  8.                         <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce porttitor auctor turpis.</p>
    9. 
   
  9.                   </div>
    10. 
   
  10.             </div>
    11. 
   
  11.       </div> </div>
    12. 
  

  

   I get this in return:
  

  

   

  

  

   
    
    
  1. <div id="content">
    2. 
    
  2.       <div id="our_work">
    3. 
    
  3.             <p><span class="prev"> &lt; </span> <span id="s_index">1</span>/<span id="s_total">0</span> <span class="next"> &gt; </span></p>
    4. 
    
  4.       </div>
    5. 
    
  5.       <div id="block">
    6. 
    
  6.       </div>
    7. 
    
  7.       <div>
    8. 
    
  8.             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce porttitor auctor turpis.</p>
    9. 
    
  9.             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce porttitor auctor turpis.</p>
    10. 
    
  10.             <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce porttitor auctor turpis.</p>
    11. 
    
  11.       </div>
    12. 
    
  12. </div>
    13. 
   

   

    It'd seem that Jquery is parsing and rearranging the html from the remote page. Has anyone find this?