The below code is working in firefox and chrome but not in safari. Can anybody tell me if this is the correct way to add multiple classes and id's in jquery?

jquery

$(document).ready(function () {
$('.imgLink, .imgLink1, .imgLink2, .imgLink3, .imgLink4, .imgLink5, .imgLink6, 
.imgLink7, .imgLink8, .imgLink9').click(function () {
    var imgPath = $(this).attr('href');
    $('#theImage, #theImage1, #theImage2, #theImage3, #theImage4, #theImage5, #theImage6, 
#theImage7, #theImage8, #theImage9').attr('src', imgPath);
    return false;
  });
});

html for .imgLink

<a class="imgLink1" href="http://www.customtie.com/images/press/printwear-11-2013.jpg">Printwear Nov 2013</a>

hmtl for #theImage

<img id="theImage" src="http://www.customtie.com/images/press/counselor-2-2014.jpg" alt="" width="auto" height="auto">

I would first agree with m90's suggestion that you want to just add a single class to all these elements and select off that.

But I would presume that the issue is the carriage return halfway through your string. If you want to start a new line, you have to end the first one and then concatenate them together like this:

<!-- language: lang-js -->
$('.imgLink, .imgLink1, .imgLink2, .imgLink3, .imgLink4, .imgLink5, .imgLink6,'+ 
  '.imgLink7, .imgLink8, .imgLink9').click(function () {
    var imgPath = $(this).attr('href');
    $('#theImage, #theImage1, #theImage2, #theImage3, #theImage4, #theImage5, #theImage6, ' +
      '#theImage7, #theImage8, #theImage9').attr('src', imgPath);
    return false;
});