javascript - How can I toggle a class inside a button on click? -

what's proper way toggle couple classes on click in jquery?

1) html before click:

<button class="btn"><i class="icon-sign-blank"></i> click me!</button>

2) html after click:

<button class="btn btn-success"><i class="icon-check"></i> clicked!</button>

3) html after click: (same beginning)

<button class="btn"><i class="icon-sign-blank"></i> click me!</button>

current jquery:

$('btn').on('click',function(e) {     $('btn > i').removeclass('icon-sign-blank').addclass('icon-check');     $('btn').addclass('btn-success'); });

but works once, not again. what's proper way handle both directions?

you can - should - use toggleclass manage !

$('btn').on('click',function(e) {     $('btn > i').toggleclass('icon-sign-blank icon-check');     $(this).toggleclass('btn-success'); });

Detect