I'm trying to have a "close" link in a div that is expanded by click on an h3 that is the toggler. The trick is, I need that close click to then change the class of the h3 that preceeds it, not all h3s on the page.
<h3 class="accToggler ">Title</h3> <div class="accContent"> <p>Content</p> <p class="close">Close</p> </div> So far my script looks like this: <script type="text/javascript"> $(function() { $ ('#ailment').find('.accContent').hide().end().find('.accToggler').click(function() { $(this).next().slideToggle(); }); $(".accToggler").toggle(function() { $(this).removeClass("accToggler").addClass("accTogglerClose"); },function(){ $(this).removeClass("accTogglerClose").addClass("accToggler"); }); $('#ailment').find('.close').click(function() { $('.accContent').slideUp(); $ (this).prev('.accToggler').removeClass("accTogglerClose").addClass("accToggler"); }); }); </script> Thanks in advance.