Why is this jquery AJAX not functioning?

I am trying to load image descriptions from a gallery of images on the same page via AJAX but it keeps directing to a new page from the link url in the image, I dont know why

heres the code in the head:

<script type=”text/javascript” src=”jquery-1.8.1.js”></script>
<script type=”text/javascript”>
$(document).ready(function(){
$(‘.gallery a’).click(function() {
var url=$(this).attr(‘href’);
$(‘#maincontenttext’).load(url + ” #maincontenttext”);
return false;
});
});
</script>

Heres the code for the HTML in the site:

<div id=”gallery”>
<a href=”nexgen.html”><img src=”nexgen.jpg” width=”100″ height=”100″ /></a>
<a href=”silver.html”><img src=”silver-spark.jpg” width=”100″ height=”100″ /></a>
<a href=”crab.html”><img src=”crab.jpg” width=”100″ height=”100″ /></a>
</div>

heres the <divs> what I want to change to reflect each photo description:

<div id=”maincontenttextimage”><img src=”nexgen-lrg.jpg” width=”300″ height=”299″ /></div>
<div id=”maincontenttext”><h1>Photo explanation header placeholder</h1>
<p>Place holder explanation/description of clicked photo from gallery</a>.</p>
</div>

Whats going on? why does it load the silver.html to a new page when I click on the photo not keep it on the same page??????

Plus how can you load 2 <div> from the destination page?

Thanks for any help on this, much appreciated.

Also in #JavaScript _↴