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.

Reply via email to