Alex Ironside
Alex Ironside

Reputation: 5039

Grabbing a parent of a certain element

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

Answers (2)

eeXBee
eeXBee

Reputation: 133

In your case:

$(this).parent().parent().parent().find('h2').css('color', 'yellow');

https://jsfiddle.net/1nksxhe0/3/

Upvotes: 1

adeneo
adeneo

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');
});

FIDDLE

Upvotes: 3

Related Questions