Page not working properly on jquery load function
<p>I have this script.</p>

<pre><code>&lt;script type="text/javascript"&gt;
$(document).ready(function(){
   $("#send").click(function(){
      $("#image_results").load('/gallary1.php');
   });
});
&lt;/script&gt;
</code></pre>

<p>When I click the send button it should load gallary1.php into the image_results <code>&lt;Div&gt;</code> however it doesn't load it properly?</p>

<p>If I just use the include_once("gallary1.php"); command inside the <code>&lt;Div&gt;</code> then is displays properly. I'm guessing the Script is changing the code somehow but have no idea how.</p>

<p>Below is the php page I'm trying to load in. </p>

<pre><code>$gallary="";
$gallary.='


&lt;div class="content"&gt;
                &lt;div id="rg-gallery" class="rg-gallery"&gt;
                    &lt;div class="rg-thumbs"&gt;

                        &lt;div class="es-carousel-wrapper"&gt;
                            &lt;div class="es-nav"&gt;
                                &lt;span class="es-nav-prev"&gt;Previous&lt;/span&gt;
                                &lt;span class="es-nav-next"&gt;Next&lt;/span&gt;
                            &lt;/div&gt;
                            &lt;div class="es-carousel"&gt;
                                &lt;ul&gt;
                                    &lt;li&gt;&lt;a href="#"&gt;&lt;img src="images/thumbs/1.jpg" data-large="images/1.jpg" alt="image01" data-description="From off a hill whose concave womb reworded" /&gt;&lt;/a&gt;&lt;/li&gt;
                                    &lt;li&gt;&lt;a href="#"&gt;&lt;img src="images/thumbs/2.jpg" data-large="images/2.jpg" alt="image02" data-description="A plaintful story from a sistering vale" /&gt;&lt;/a&gt;&lt;/li&gt;
                                &lt;/ul&gt;
                            &lt;/div&gt;
                        &lt;/div&gt;

                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;';


echo $gallary;
</code></pre>

<p>Any help would be greatly appreciated. Also if there is any more info I need to provide please let me know.</p>

<p>I have found that if I load gallary1.php via include then the resulting html is:</p>

<pre><code>&lt;div class="content"&gt;
                &lt;div id="rg-gallery" class="rg-gallery"&gt;&lt;div class="rg-view"&gt;&lt;a href="#" class="rg-view-full"&gt;&lt;/a&gt;&lt;a href="#" class="rg-view-thumbs rg-view-selected"&gt;&lt;/a&gt;&lt;/div&gt;
                    &lt;div class="rg-thumbs"&gt;

                        &lt;div class="es-carousel-wrapper"&gt;
                            &lt;div class="es-nav"&gt;
                                &lt;span class="es-nav-prev"&gt;Previous&lt;/span&gt;
                                &lt;span class="es-nav-next"&gt;Next&lt;/span&gt;
                            &lt;/div&gt;
                            &lt;div class="es-carousel"&gt;
                                &lt;ul style="width: 154px; display: block; margin-left: 0px;"&gt;
                                    &lt;li class="selected" style="margin-right: 3px; width: 69px;"&gt;&lt;a href="#" style="border-width: 2px;"&gt;&lt;img src="http://www.fyom.16mb.com/images/thumbs/1.jpg" data-large="images/1.jpg" alt="image01" data-description="From off a hill whose concave womb reworded"&gt;&lt;/a&gt;&lt;/li&gt;
                                    &lt;li style="margin-right: 3px; width: 69px;"&gt;&lt;a href="#" style="border-width: 2px;"&gt;&lt;img src="http://www.fyom.16mb.com/images/thumbs/2.jpg" data-large="images/2.jpg" alt="image02" data-description="A plaintful story from a sistering vale"&gt;&lt;/a&gt;&lt;/li&gt;
                                &lt;/ul&gt;
                            &lt;/div&gt;
                        &lt;div class="es-nav"&gt;&lt;span class="es-nav-prev" style="display: none;"&gt;Previous&lt;/span&gt;&lt;span class="es-nav-next" style="display: none;"&gt;Next&lt;/span&gt;&lt;/div&gt;&lt;/div&gt;

                    &lt;/div&gt;
                &lt;div class="rg-image-wrapper"&gt;           &lt;div class="rg-image-nav"&gt;       &lt;a href="#" class="rg-image-nav-prev"&gt;Previous Image&lt;/a&gt;       &lt;a href="#" class="rg-image-nav-next"&gt;Next Image&lt;/a&gt;      &lt;/div&gt;          &lt;div class="rg-image"&gt;&lt;img src="images/1.jpg"&gt;&lt;/div&gt;     &lt;div class="rg-loading" style="display: none;"&gt;&lt;/div&gt;     &lt;div class="rg-caption-wrapper"&gt;      &lt;div class="rg-caption" style=""&gt;       &lt;p&gt;From off a hill whose concave womb reworded&lt;/p&gt;      &lt;/div&gt;     &lt;/div&gt;    &lt;/div&gt;&lt;/div&gt;
        &lt;/div&gt;
</code></pre>

<p>However when is loaded via the script:</p>

<pre><code>&lt;div class="content"&gt;
                &lt;div id="rg-gallery" class="rg-gallery"&gt;
                    &lt;div class="rg-thumbs"&gt;

                        &lt;div class="es-carousel-wrapper"&gt;
                            &lt;div class="es-nav"&gt;
                            &lt;span class="es-nav-prev"&gt;Previous&lt;/span&gt;
                            &lt;span class="es-nav-next"&gt;Next&lt;/span&gt;
                        &lt;/div&gt;
                        &lt;div class="es-carousel"&gt;
                            &lt;ul&gt;
                                &lt;li&gt;&lt;a href="#"&gt;&lt;img src="images/thumbs/1.jpg" data-large="images/1.jpg" alt="image01" data-description="From off a hill whose concave womb reworded"&gt;&lt;/a&gt;&lt;/li&gt;
                                &lt;li&gt;&lt;a href="#"&gt;&lt;img src="images/thumbs/2.jpg" data-large="images/2.jpg" alt="image02" data-description="A plaintful story from a sistering vale"&gt;&lt;/a&gt;&lt;/li&gt;
                            &lt;/ul&gt;
                        &lt;/div&gt;
                    &lt;/div&gt;

                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/div&gt;
</code></pre>

<p>So something is not being picked up. As is it displaying what I echo out however when the page loaded properly is is inheriting additional formatting.</p>