Problems defining value of css attribute using .css() with a variable

Question

I am trying to create a function that will change the color of a span from black to a random color from a list of colors I have defined. My problem seems to be in the .css("color", variableName) part. I think I may be doing my syntax wrong. ( http://jsfiddle.net/crismanNoble/8gM76/ )

$(".randomRoll")
    .mouseover(function() {
               var colors = ["6F216C", "F34B0D", "C50102", "5DA537", "F1D81B"];
               var pick = Math.floor(Math.random()*5);
               var colorN = colors[pick];
               $(this).css("color", colorN); 
               //alert(colorN);
               })
    .mouseout(function() {
              $(this).css('color','black');
    });

$(this).css("color","#" + colorN); would do the trick ...

Hannes
– Hannes

2012-01-25 16:23:58 +00:00
Commented Jan 25, 2012 at 16:23 — Hannes
– Hannes, Commented Jan 25, 2012 at 16:23

Richard Dalton · Accepted Answer · 2012-01-25 16:25:52Z

7

You have to add a hash (#) in front of any hex values you use in CSS. $(this).css("color","#"+colorN);

or better yet add them in your colors array.

edited Jan 25, 2012 at 16:25

Richard Dalton

35.8k6 gold badges75 silver badges92 bronze badges

answered Jan 25, 2012 at 16:22

TJHeuvel

12.6k4 gold badges40 silver badges46 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

TJHeuvel Over a year ago

Everyone looks over small errors such as those once in a while :) @Derek Thanks, edited.

MetalFrog Over a year ago

That's not a bracket, it's a hash. Brackets are either square [] or curly {}. :)

Collectives™ on Stack Overflow

Problems defining value of css attribute using .css() with a variable

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related