Trouble assigning hover function to a series of images

Trouble assigning hover function to a series of images

I have a product page where the customer has the option to s lect the product in two colours. I am using jquery to change a series of  images  and thier hover functions based on the color choice.

I am succesfully changing the images, but the hover functions are not being called with the correct parameters.

There are 7 images for black which are assigned numbers 2-8, and 6 images for brown which are assigned numbers 9-14.

However the hover function for black is always called with param 9, and the brown with 15. These params should match the number assigned to the image.

You can see it in action here:

http://fjdpa.kdrfd.servertrust.com/ProductDetails.asp?ProductCode=SMART-HOLSTER

Login with barb.woolums@ymail.com and password ruby250

Here is the relevant code

  1. function blackshFunction() {
  2.       var j=0;
  3.       for(var i=2;i<9;i++) {
  4.          $("#altviews a").eq(j).attr("href","/v/vspfiles/photos/SMART-HOLSTER-" + i + ".jpg");
  5.          $("#altviews a img").eq(j).attr("src","/v/vspfiles/photos/SMART-HOLSTER-" + i + "S.jpg");
  6.          $("#altviews a img").eq(j)
  7.              .removeAttr("onmouseover")
  8.              .hover(function() {
  9.                  // replaces onmouseover
  10.                  change_multiple_product_photo(i);
  11.                  //return false;
  12.          });
  13.          $("#altviews a img").eq(j).attr('id',"alternate_product_photo_" + i);
  14.          j=parseInt(j)+1;
  15.       }
  16.       $("#altviews a").eq(6).show();
  17.       $("#altviews a img").eq(6).show();
  18. }
  19. function brownshFunction() {
  20.       var j=0;
  21.       for(var i=9;i<15;i++) {
  22.          $("#altviews a").eq(j).attr("href","/v/vspfiles/photos/shbrown/SMART-HOLSTER-" + i + ".jpg");
  23.          $("#altviews a img").eq(j).attr("src","/v/vspfiles/photos/shbrown/SMART-HOLSTER-" + i + "S.jpg");
  24.          $("#altviews a img").eq(j)
  25.              .removeAttr("onmouseover")
  26.              .hover(function() {
  27.                  // replaces onmouseover
  28.                  change_multiple_product_photo(i);
  29.                  //return false;
  30.          });
  31.          $("#altviews a img").eq(j).attr('id',"alternate_product_photo_" + i);
  32.          j=parseInt(j)+1;
  33.       }
  34.       $("#altviews a").eq(j).hide();
  35.       $("#altviews a img").eq(j).hide();
  36. }