event.stopPropagation(); doesn't behave as expected
- by Ciprian Amaritei
I read couple articles related to event.stopPropagation(); but none of the solutions provided works for me.
Basically what I have is an accordion widget with all the elements collapsed by default. On each element header (dt tag) there is also a checkbox. Clicking the checkbox shouldn't trigger the accordion to make its elements expand.
<dt data-toggle="collapse">
<span class="subscribe-checkbox"><button type="button" class="btn toggle-btn" data-toggle="button"></button></span>
</dt>
<dd>
<p>Accordion content...</p>
</dd>
Clicking the span (which should act as a checkbox ) should add class "checked" to it. However it also expands the accordion element (dd tag).
What I'm doing in jQuery is:
$('.accordion-group .btn.toggle-btn').click(function (event) {
event.stopPropagation();
});
While the accordion content isn't shown ( which is good) the element doesn't change class either, so it doesn't become 'checked'.
I tried with .live() too and didn't work either.
Thanks in advance,
Ciprian.