jQuery Forum

I tried different things from the web but its still not wat i was searching for, maybe someone here can help me out...

I have 2 buttons on a page, each button can be pressed and they change their state just by switching a sprite image. I use a jscript for a pressed state so that they stay pressed when clicked. 

Now what i want is that when i just click one of the buttons the otherone automatically switches to his normal unpressed state.

This is de code i use for pressing and changing the class to .active. My idea was to use an nonactive class to switch button2 to its normal state.

 $(document).ready(function(){

   $('.button1').click(function() {

    $(this).toggleClass('button1').toggleClass('active');

       $(this).toggleClass('button2').toggleClass('nonactive');       (this line i tried but it wont work)

});   

});

$(document).ready(function(){

   $('.button2').click(function() {

$(this).toggleClass('button2').toggleClass('active');

});   

});

-----------------------------------

HTML

<li class="button1"><a class="button1" href="javascript:showonlyone('newboxes1');" title="informatie"><span class="displace">Info</span></a></li>