Reputation: 5039
I'm trying to make a sliding mini menu. I'm trying to do it using jquery. Basically, I need to grab the h2 element that is in a certain box.
https://jsfiddle.net/1nksxhe0/2/
It yelled at me to add code here, so I'm adding the main JS function, but it makes more sense to put it on jsfiddle
$('.category-button').on('click', function () {
$(this).closest('h2').css('color','yellow');
});
For example, if I click the see the videos button under animation I want only the Animation h2 to light up.
Upvotes: 0
Views: 29
Reputation: 133
In your case:
$(this).parent().parent().parent().find('h2').css('color', 'yellow');
https://jsfiddle.net/1nksxhe0/3/
Upvotes: 1
Reputation: 318162
The H2 element isn't a parent of the button, your markup is as follows
<h2 class="col-md-12 text-center category-title">Self Promotion </h2>
<div class="col-md-12 text-center">
<a target="_blank" href="url">
<button id="..." type="button" class="btn category-button">See The Videos</button>
</a>
</div>
Meaning you want the closest DIV, then the previous H2
$('.category-button').on('click', function () {
$(this).closest('div').prev('h2').css('color','yellow');
});
Upvotes: 3