[jQuery] Toggle not working correctly
Hi,
On a click event I want to slideToggle and show and alert for open and
close states. But the alert shows different behavior in IE &
FireFox; neither in correct order.
HTML:
<div class="showBlock">
<a href="#" class="showTitle">The Office</a>
<div class="showDescription">The best show on US networks....</div>
</div>
<div class="showBlock">
<a href="#" class="showTitle">The Office</a>
<div class="showDescription">The best show on US networks....</div>
</div>
<div class="showBlock">
<a href="#" class="showTitle">The Office</a>
<div class="showDescription">The best show on US networks....</div>
</div>
<div class="showBlock">
<a href="#" class="showTitle">The Office</a>
<div class="showDescription">The best show on US networks....</div>
</div>
Script:
<script type="text/javascript">
$(".showTitle").bind("click", function(){
$(this).next(".showDescription").slideToggle();
$(this).toggle(function(){alert("open");}, function()
{alert("close");})
return false;
});
</script>