...

View Full Version : jQuery Need help setting a toggleClass on a parent div



Warhawk94
12-22-2010, 12:58 AM
Hey all!
I need help setting a toggleClass on a parent div of an anchor tag, the same anchor tag will call either an onClick or .click function and needs to set the toggleClass on the parent div, but only on the anchor tag that is clicked.

Here is some code...

HTML - The div with the class "opg-link" will have the javascript function call on it (currently activeBioImg();), and the parent div classed "opg-image", needs to have the toggleClass('classname') added to it.


<div id="op-gallery">
<div class="loader"><img height="11" width="16" align="absmiddle" class="load" src="../imgs/loader.gif" style="display: none;"></div>
<div class="opg-container">
<div style="background-image: url(bio-images/someimage.jpg);" class="opg-image">
<a onclick="javascript:loadBio('bio1');javascript:activeBioImg();" class="opg-link" title="Name" href="#"></a>
</div>
<div class="opg-name">Some name</div>
</div>
<div class="opg-container">
<div style="background-image: url(bio-images/someimage.jpg);" class="opg-image">
<a onclick="javascript:loadBio('bio2');javascript:activeBioImg();" class="opg-link" title="Name" href="#"></a>
</div>
<div class="opg-name">Some name</div>
</div>


A couple things I've tried so far.

function activeBioImg() {
$('a.opg-link').each(function () {
$('this').parent().toggleClass('bio-active-img');
});
}

and


$('a.opg-link').parent().toggleClass('bio-active-img');

Which works... except it does it on all divs (duh, because there is no way to distinguish between the clicked anchor and the other anchors)

Any ideas? I've been stuck for hours, and it's probably something really simple.

SB65
12-22-2010, 09:03 AM
How about:


$('a.opg-link').click(function () {
$(this).parent().toggleClass('bio-active-img');
});


Note it's $(this) not $('this').



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum