Best practices on setting values on 10 images

Best practices on setting values on 10 images

hi guys,
I have a main image and 10 thumbnails with hover over effects that are set dynamically. 

I have only pasted top 5, I also have a 3rd option for hover on effects and wondering if I am on the right path

Is the script below ok ? If not, whats best practice ?

thanks
Ehi

  1.  $('#Image1').click(function () {

  2.             $("#canvas").addClass('sepia');
  3.         });
  4.         $('#Image2').click(function () {

  5.             $("#canvas").addClass('saturate');
  6.         });
  7.         $('#Image3').click(function () {

  8.             $("#canvas").addClass('invert');
  9.         });

  10.         $('#Image4').click(function () {

  11.             $("#canvas").addClass('shadow');
  12.         });
  13.         $('#Image5').click(function () {

  14.             $("#canvas").addClass('blur');
  15.         });



  16. //I also have the same for setting the image url

  17.     $('#Image1').attr("src", message);
  18.                     $('#Image2').attr("src", message);
  19.                     $('#Image3').attr("src", message);
  20.                     $('#Image4').attr("src", message);
  21.                     $('#Image5').attr("src", message);