$("p.more a").click(function() { $(this).parent().siblings("div.overflow").toggle(); $(this).toggle( function() {$(this).html("« Less"); alert('1');}, function() {$(this).html("More »"); alert('2');} ); });
I am referring to "p.more a" when mentioning a click. The first time I click no alert is fired. The second time I click 1 is alerted. The third time I click 2 is alerted then 1 is alerted. The fourth time I click 2 is alerted, 1 is alerted, 2 is alerted. And so on. Every time "div.overflow" is toggled correctly. Why is it recursively operating like this?