How Should I Initialize This Variable For Use With Jquery?

What I'd like to do is make a variable that is a specific class/id object. For example, on lines (5) and (8) where I do a literal reference of the ID, shoe-carousel, I want to have

Solution 1:

After first realizing I posted a not-appropriate answer, then reading comments under @Redmega's answer, I think that the most efficience response to the OP's issue is like this:

var fooCarousel = $('.shoe-carousel');
1.//initialize the slide in focus and what will be the center slide2.var slideInFocus = document.createElement('img');
​3.4.//set the index of the immediate slide in focus when the page loads5. slideInFocus.index = fooCarousel.slick('slickCurrentSlide');
6.7.//set the source of the immediate slide in focus when the page loads8. slideInFocus.src = $('.slick-current img', fooCarousel).prop('src');

While very close to the $fooCarousel.find('.slick-current img') solution, this way has probably the less performance impact.

Edit: actually it doesn't make any difference, as pointed by @Redmega.

Solution 2:

There's no problem doing it the way you are suggesting, the issue is I think your implementation in line 8. How are you trying to call it? Something like this would work well. .find() will find the selector within the jquery object you are calling it from.

1. var$fooCarousel = $('.shoe-carousel');
2. var slideInFocus = document.createElement('img');
​3. 
4. //set the index of the immediate slide in focus when the page loads5. slideInFocus.index = $fooCarousel.slick('slickCurrentSlide');
6.     
7. //set the source of the immediate slide in focus when the page loads8. slideInFocus.src = $fooCarousel.find('.slick-current img').prop('src');

Solution 3:

Warning: as pointed by others, this answer doesn't solve the OP issue. I too quickly read the question, so the proposed code below would works only with fooCarousel containing the string id!

Yes it's what you guessed. And it's easy to workaround, using usual concatenation, like this:

1.//initialize the slide in focus and what will be the center slide2.var slideInFocus = document.createElement('img');
​3.4.//set the index of the immediate slide in focus when the page loads5. slideInFocus.index = fooCarousel.slick('slickCurrentSlide');
6.7.//set the source of the immediate slide in focus when the page loads8. slideInFocus.src = $(fooCarousel + ' .slick-current img').prop('src');