I have:

<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>

My jQuery is:

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

Q: How do I toggle classes between ui-icon-circle-triangle-n and ui-icon-circle-triangle-s as the user clicks on .ui-widget-header?