I'm dealing with a grid that has 3 columns, each sharing the same div class. Inside each column is a span with either the class of class="simplefavorite-button" or
class="simplefavorite-button.active"<div class="vc_grid-item">
<div class="some-class">content</div>
<span class="simplefavorite-button">heartbutton</span>
</div>
<div class="vc_grid-item">
<div class="some-class">content</div>
<span class="simplefavorite-button">heartbutton</span>
</div>
<div class="vc_grid-item">
<div class="some-class">content</div>
<span class="simplefavorite-button.active">heartbutton</span>
</div>
My goal is to remove the topmost div for any column with the class class='vc_grid-item' if the element within that parent class does not have the class class="simplefavorite-button.active".
Here is the code I've attempted, but unfortunately, it hasn't worked. Any assistance would be greatly appreciated. Thank you.
Here's My Code
jQuery('simplefavorite-button.active').each(function () {
jQuery('span').not(this).closest('.vc_grid-item').hide();
});