Question

Hello friends following is my code

HTML

 <ul>
    <li>
    <div class="input"><input name="" type="checkbox" value="" id="a"/></div>
    <div >Name of the survey goes here | 35 Points - <span>Begin Survey</span></div> 
    </li>
</ul>

Jquery

<script>
$(document).ready(function(){

    $('#a').click(function(){

    $(this).next('div').addClass('.check_clicked');

    })
})
</script>

CSS

.check_clicked
{
    text-decoration:line-through;
    color:#b6a7a7;
}

I just want to if check box value checked then class .check_clicked should apply on next div

Answer 1

.next() accesses the next sibling. However, your #a element does not have one.

What you want is $(this).parent().next()

You also need to remove the . in the class name – addClass() only accepts classes so it does not need a . in front of the class name.

Here’s a working demo: http://jsfiddle.net/DqLRc/
If unchecking the checkbox should not remove the class again, simply keep addClass instad of my toggleClass call.