jquery - Click links to load the relevant image into a container -

i have links when click on them, need them load image container, , when click close link, hides again.

i have example of here unsure how apply images div link if makes sense:

http://jsfiddle.net/sgktv/1/

i assume need along lines of this....

<a class="click" href= "#" src="image/location">click here fadein image in container</a> 

i going have many links images , container stay same.

what best , efficient way start this?

thanks!

$(function () {     $("a.click").click(function (event) {         //hide panel in case it's visible because of loaded image         $("#hiddenpanel").fadeout(0);         //disable default link click event page not change if link has href         event.preventdefault();         //set links src src of image in hidden panel          $("#hiddenpanel img").attr("src", $(this).attr("src"));         $("#hiddenpanel").fadein(1000);     });     $("#closebutton").click(function () {         $("#hiddenpanel").fadeout(1000);     }); }); 

fiddle

you may want fade out image instead of fadeout(0) if it's visible, , load new 1 after fade out complete.