jQuery each this
You probably want to do:
$(this).addClass
Inside jQuery callback functions, this
(and also value
, in your example) refers to a DOM object, not a jQuery object.
var slides = $(".promo-slide");
slides.each(function(key, value){
if (key == 0) { // NOTE: the key will start to count from 0, not 1!
$(this).addClass("first"); // Or $(value).addClass("first");
//------^^----^
}
});
BUT: In your case, this is easier:
$(".promo-slide:first").addClass("first");
And when all .promo-slide
elements in the same container, a solution in pure CSS is even easier:
.promo-slide:first-child {
/* ... */
}
As an aside, I find it a useful convention to prefix variables that contain a jQuery object with a $
:
var $slides = $(".promo-slide");
$slides.each( /* ... */ );