jQuery: addClass

JavaScript
1

Seems like I have a jQuery question everyday! haha … Here’s the HTML:

<!-- Sub video -->
<div class="sub-video">

<a href="#" id="yoga01"><span class="btn-play">Play</span><img src="img/yoga01.jpg" width="150" height="91" alt="Vidéo" title="Vidéo" />
</a>

<p>Boot camp <br/> <span class="author">With Diana "Dianamite" Destounis</span></p>

</div><!-- Sub video -->

Basically what I want to is add a class to “.btn-play” when “.sub-video a” is hovered.

I tried this code (see below) but when I have a multiple “.sub-video” blocks they all get the class. What is the solution to only apply the element that follow “.sub-video a”. Thanks!

	$('.sub-video a').hover(function() {
		$('.btn-play').addClass('hover');
		}, function() {
		$('.btn-play').removeClass('hover');
	});
2

You restrict the selector to the context of the hovered link.


$('.btn-play', this)

See: http://api.jquery.com/jQuery/

3

Thanks again pmw57, you saved me! I will definitely read this!