Code works, but not able to repeat without page refresh - jQuery
<p>When I click on a image, in the below div</p>

<pre><code>&lt;img src='uploads/&lt;? echo $dir; ?&gt;/&lt;? echo $file; ?&gt;/&lt;? echo $file1; ?&gt;' width='100px' height='100px' style='margin-left:5px; margin-bottom:5px; border:#fff solid 2px;' id='&lt;? echo $i; ?&gt;' class="ind_img"&gt;
</code></pre>

<p>using this jquery code</p>

<pre><code>$('.ind_img').bind('click',function(f){

var img_large = f.target.id;
var img_src = $('#'+img_large).attr('src');
var disp = '&lt;div  style="margin:0px;"&gt;&lt;img src="'+img_src+'"&gt;&lt;/div&gt;';
$('#display').html(disp);

});
</code></pre>

<p>the image enlarges in the following div replacing the <code>&lt;? include('gallery.php'); ?&gt;</code> with <code>&lt;div  style="margin:0px;"&gt;&lt;img src="'+img_src+'"&gt;&lt;/div&gt;</code> (above code)</p>

<pre><code>&lt;div id="display" style="overflow-y:scroll; overflow-x:none height:598px;"&gt;
  &lt;? include('b.php'); ?&gt;
&lt;/div&gt;
</code></pre>

<p>But when I click on <code>&lt;div id=all&gt;All&lt;/div&gt;</code> <code>&lt;div  style="margin:0px;"&gt;&lt;img src="'+img_src+'"&gt;&lt;/div&gt;</code> is replaced by </p>

<pre><code>&lt;? include('gallery.php'); ?&gt;    

&lt;div id="display" style="overflow-y:scroll; overflow-x:none height:598px;"&gt;
  &lt;? include('b.php'); ?&gt;
&lt;/div&gt;
</code></pre>

<p>This is all fine, but I am not able to repeat this step without refreshing this page, why?</p>

<p>Thanks
Jean</p>
