I've seen some very similar questions floating around but haven't been able to find the answer I'm looking for. I've already determined a work-around but would like to know the proper way to perform the task.

What I desire is to click the button and have the active state stay persistent. The next click will toggle the state and that is desired. What I really need to know is how to address the uiButton:active state.

HTML:

<input type='button' class='uiButton' id='testbutton' value='testValue'>

CSS:

.uiButton{

    background-color: red;

}



.uiButton:active{

    background-color:blue;

}

Javascript/jQuery:

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

    $(this).toggleClass(//active state);

});