font color change for every click using jquery

Question

hi, I am using jquery in my application.I need to change the font-color of the text enclosed in <p></p> tags every time a click is made on the text. Thanks

Answer 1

You need to specify the tags and then change the css for this tags, e.g. for a <div id="yourid">:

$('#yourid').click(function() {
    $('#yourid').css('color' : '#yourNewColor');
});

Answer 2

Try something like this where your tags have a class "tag" and the font-colour is defined by a class called "highlight":-

$(document).ready(function(){
  $('.tag').click(function(){
    $(this).toggleClass('highlight');
  });
});

Answer 3

I'm not sure where the next color comes from, so here's an example using a random color each click:

$('p').click(function() {
    $(this).animate({ 
        'color': 'rgb('+ (Math.floor(Math.random() * 256)) +','+ 
                         (Math.floor(Math.random() * 256)) +','+ 
                         (Math.floor(Math.random() * 256)) +')'
    }, 500);
});​

You can view a demo of the effect here :)

If you don't want it to animate like I have, just change .animate() to .css() and the change will be instant, like this.