Hello together

I call a certain div from another page with jquery to be loaded into a div on my main page like this:

<script type="text/javascript">
$("#scotland").load("http://www.example.com/scotland .gallery");
</script>
<div id="scotland"></div>

The div I call is a piece of code which is automatically generated by a CMS made simple module, by the way.

Now it comes to my problem: The .gallery div I call, looks, a little simplified, like this:

<div class="gallery">
    <span><img src="http://www.example.com/scotlandimage1.jpg"></span>
    <span class="imgnavi"><a href="link_to_next_page_with_one_image">Next image</href></span>
</div>

I want the "next image"-link to load the next page into the .gallery div (it is always a page with one image on it). But what it does, is, it opens the new page http://www.example.com/scotland only.

I tried to use jquerys .live event to load the linked page (that would be "scotlandimage2" and the navigation, as you can see in the upper part - not only the image!), but I must have done something wrong. I tried different ways, but never got it to work. This was my last try:

$(".imgnavi a").click(function() {
  var myUrl = $(this).attr("href");
  $(".gallery").load(myUrl);
  return false;
});

I have to admit that I am very new to jquery... But does someone know what I did wrong (do I even follow the right handlers?)?

Thanks very much in advance!

Martin