Jquery: Toggle text colors with checkboxes?

I want to be able to set the color of a text passage when a certain checkbox is checked. I've tried stuff like

$('#CheckboxForMakingStuffBlue:checked').( function() {
   $('span.externalNarrative').css("color","开发者_运维知识库blue");
   });

but I can't get anything to work. Is there another function I should be using, or an "if" statment of some sort? I'm very very new to jquery, and to stuff like this.

---

Please check the link : http://jsfiddle.net/developeryamhi/BeLVq/3/ for detailed help

---

I suggest you use radio input instead as you will only have one color at a time. See working example here:

http://jsfiddle.net/9VwuR/1/

$(":radio").click(function(){
    $("p").css({color: $(this).val() });
});

The key is that you need to attach an event to the element, in this case is click, because you want this color change to happen when the user selects an input.

Check some other jQuery events here: http://api.jquery.com/category/events/

---

Your code is not correct, should be like this:

$('#CheckboxForMakingStuffBlue').click(function(){
  if ($(this).is(':checked')){
     $('span.externalNarrative').css("color","blue");
  }
  else {
     $('span.externalNarrative').css("color","black");
  }
});

Also make sure to wrap your code in ready handler:

$(function(){
    $('#CheckboxForMakingStuffBlue').click(function(){
      if ($(this).is(':checked')){
         $('span.externalNarrative').css("color","blue");
      }
     else {
         $('span.externalNarrative').css("color","black");
     }
    });
});

---

You need to add a trigger: http://jsfiddle.net/LekisS/RFFHA/

---

you shoud use

    $('#CheckboxForMakingStuffBlue').change(function(){ 

  // some conditions here
      $('span.externalNarrative').css("color","blue");
       });

    })

Something like this