Search code examples
jqueryradio-buttonlabeltoggleclass

jQuery toggle class of label when radio button is clicked

I have a label surrounding my radio button where the background is supposed to change on :hover and :focus

<label for="radio1" class="radio-blur">
<input name="job" id="radio1" value="1" type="radio"> Graphic Design</label>

I want to change the class from .radio-blur to .radio-focus

I have 

    $(document).ready(function(){
        $('input:radio').click(function() {
            $(this).parent('label').toggleClass('.radio-focus');
        });  
    });

But it doesn't work... please help

Solution

  • Remove the dot in the class

    $(this).parent('label').toggleClass('radio-blur radio-focus');

    JSFiddle