Question

I have this Jquery code, that will remove color from the text if the checkbox is not checked. However , there are multiple divs with the checkbox for the same model, when I uncheck one checkbox , all divs with the model class are unchecked/color removed. how can i alter this to target the parent Nodes of the checkbox only :

$(document).ready(function() {
  $('input[type="checkbox"]').click(function() {
      var togClass=$(this).attr('class');
      if($(this).attr('checked')){
     this.parentNode$('div.' + togClass ).css("display", "inline-block");
      }
      else {
         $('div.' + togClass ).css("display", "none");
      }
   });
});

Answer 1

you should use one class to color the text of the div, so you can alter it easily by adding and removing the given class:

$("input[type='checkbox']").click(function() {
        if($(this).attr('checked'))
           $(this).parent('div').addClass('colorclass');
        else
            $(this).parent('div').removeClass('colorclass');
    });