Change bg on radio deselect

Question

This is just an add on to my last question. Once I deselect the radio button I need to return the background color to its original state. So the solution we came up with is:

$(document).ready(function(){
    $('input:radio').change(function(){
        $(this).closest('div').toggleClass('highlight');
    });
});

Now I need to remove the highlight class when the radio button is deselected - any ideas?

Answer 1

Try this, group your radios using the name attribute and the following js should work

Demo

 $('input:radio').change(function(){
        $('div.highlight').removeClass('highlight');
        $(this).closest('div').addClass('highlight');
 });