I have a simple image swap function. You hove over thumbnails and a larger img is displayed in #main-img. However, how would I make it where when the #main-image is clicked, the variating src is selected and then linked to the actual image file.

Pseudo:

If  #main-img' clicked, THEN select current src and link to images/src.jpg

I hope that makes sense and thanks in advance to whoever can help!

2. $(document).ready(function() {
3.     // Image swap on hover
4.     $(".imgBank ul li a img").hover(function(){
5.         $('#main-img').attr('src',$(this).attr('src').replace('images/large/', ''));
6.     });
7.     // Image preload
8.     var imgSwap = [];
9.      $(".imgBank ul li a img").each(function(){
10.         imgUrl = this.src.replace('large/', '');
11.         imgSwap.push(imgUrl);
12.     });
13.     $(imgSwap).preload();
14. });
15. $.fn.preload = function() {
16.     this.each(function(){
17.         $('<img/>')[0].src = this;
18.     });
19. }