Hi, When u use toggle like that, it already binds a click event on the matched elements. So, what will happen in your code is:
1. when the document is ready, it will bind a click event on 'a.toggle'; 2. when u click in 'a.toggle' it will bind a click event on '.portlet_content'; 3. when u click again, it will rebind a click event on '.portlet_content'; 4. and so on... You need to remove the click part of your code. Something like: $('a.toggle').toggle( function(){ $(this).parents('.portlet_topper').addClass('active'); }, function() { $(this).parents('.portlet_topper').removeClass('active'); } ); On Jun 22, 4:48 pm, Gercek Karakus <gerc...@gmail.com> wrote: > Hi everyone, > > I am having problems withToggle. You can see the jQuery and XHTML > code below. Please let me know if you can see what's going wrong here. > > Thanks, > > $(document).ready( > function() > { > $('a.toggle').click(function() > { > > $(this).parents('div.portlet').children('.portlet_content').toggle > (function(){ > > $(this).parents('div.portlet').children('.portlet_topper').addClass > ('active'); > },function() { > $(this).parents('div.portlet').children > ('.portlet_topper').removeClass('active'); > }); > }); > > }); > > <div class="portlet"> > <div class="portlet_topper"> > <h3>1. Most Recent Comments</h3> > <div class="toggle-container"><a class="toggle"></a></div> > </div> > <div class="portlet_content"> > <p>Lorem ipsum dolor si ipiscing laoreet nibh. In hac > habitasse platea dictumst. Aliquam erat volutpat. Cum sociis natoque > penatibus et magnis dis parturient montes, nascetur ridiculus mus. In > ut justo. Nulla libero.</p> > </div> > </div>