Question

I have a small problem. I want to check if a checkbox is checked and if it is checked, I want to add a class to his first brother.
HTML :

    <input class="box" type="checkbox">
    <p class="red">Red text </p>

    <input class="box" checked type="checkbox">
    <p class="red">I want this text in blue </p>

JS :

    if(jQuery(".box").is(":checked")) {
    jQuery(this).next().attr('class', 'blue');                              
}

Example here : http://jsfiddle.net/LVEqn/

Thanks in advance !

Answer 1

If you want to add the class ‘blue’ to all elements following a checked box, do this :

$(".box:checked").next().addClass('blue');

If you want to replace the existing class, do

$(".box:checked").next().attr('class', 'blue');

If you want this to be dynamic, that is change when the user checks or unchecks, do

$(".box").change(function(){
    $(this).next().attr('class', $(this).is(':checked') ? 'blue' : 'red');
});

DEMONSTRATION