Basculer widgets jQuery-UI

Question

j'ai:

<div class="ui-widget"> 
    <div class="ui-widget-header"> 
     <span class="ui-icon ui-icon-circle-triangle-n">My Menu</span> 
    </div> 
    <ul class="ui-widget-content"> 
     <li>Menu Item 1</li> 
     <li>Menu Item 2</li> 
     <li>Menu Item 3</li> 
    </ul> 
</div> 

Mon jQuery est:

$('.ui-widget-header').click(function() { 
    $('.ui-widget-header+ul').toggle('slow');   
}); 

Q: Comment puis-je basculer des classes entre ui-icon-cercle-triangle-n et ui-icon -cercle-triangle-s lorsque l'utilisateur clique sur .ui-widget-header?

Answer 1

manière la plus simple de le faire serait d'utiliser .toggleClass()

$('.ui-widget-header').click(function() { 
    $('.ui-widget-header+ul').toggle('slow'); 
    $('.ui-icon', this).toggleClass('ui-icon-circle-triangle-n ui-icon-circle-triangle-s');   
});