JQuery ID change class attached to ID then reacquire the same item by ID and new class name
<p>Need to specify a ID and its changed class name to change it back.  Am toggling between 3 buttons on an HTML jukebox.  So if the same button (rock) is clicked again after selecting it - rock goes silent. </p>

<p>Button action to initiate the button (1 of 3 buttons)</p>

<pre><code>$("a#butblue").click(function(){
    stopall();
    $.fn.soundPlay({url: '../audio/lounge.mp3', playerId: 'embed_playerB', command: 'play'}); 

    $("a#butblue").removeClass("blue_off");

    $("a#butgreen").removeClass("green_on");
    $("a#butgreen").addClass("green_off");
    $("a#butorange").removeClass("orange_on");
    $("a#butorange").addClass("orange_off");

    $("a#butblue").addClass("blue_on");
});

function stopall() {
    $.fn.soundPlay({playerId: 'embed_playerB', command: 'stop'});
    $.fn.soundPlay({playerId: 'embed_playerG', command: 'stop'});
    $.fn.soundPlay({playerId: 'embed_playerO', command: 'stop'});   
}
</code></pre>

<p>And now if a#butblue.blue_on is clicked again I want it to turn off.  Attempting to use the following but somehow I seem to not be connecting the ID and the changes class name.  I can see them in firebug, it is changing class.   Just cant seem to get a handle on it.  Can this be done? (its gotta be).</p>

<p>:</p>

<pre><code>$("a#butblue.blue_on").click(function(){
    stopall();  
    $.fn.soundPlay({playerId: 'embed_playerB', command: 'stop'});
    $("a#butblue").removeClass("blue_on");
    $("a#butblue").addClass("blue_off");
});
</code></pre>
