Change text to pseudo-random color using jquery

Question

I'd like to change the text color using the following code, but I get an error: Uncaught syntax: unexpected string when .each is called. I'm not sure what's wrong.

function random_rgb() {
  colors = ['8', '9', 'a', 'b', 'c', 'd', 'e', 'f'];
  r = colors.eq(Math.floor(Math.random * 8));
  g = colors.eq(Math.floor(Math.random * 8));
  b = colors.eq(Math.floor(Math.random * 8));
  return '#' + r + g + b;
};

$(document).ready({

  $("span.number").each(function(){
    this.style.color = random_rgb();
  });

});

UPDATE

I've created a jsfiddle (forgive me I'm not great w/ this app) https://jsfiddle.net/yrnqr566/

The color turns up black every time.

Math.random is a function, you need to use parenthesis to call it : Math.random() — Thomas Francois
– Thomas Francois, Commented Mar 24, 2016 at 13:26

Novocaine · Accepted Answer · 2016-03-24 13:34:15Z

4

You have a couple of errors, see this fiddle for the fixes; https://jsfiddle.net/yrnqr566/10/

$(function() {...}); is a better alternative to document.ready...

Also, you need to use Math.random() with open/close brackets, as this is a function not a property.

Third, you were using .eq() on an array. [] is the correct syntax.

function random_rgb() {
  colors = ['8', '9', 'a', 'b', 'c', 'd', 'e', 'f'];
  r = colors[Math.floor(Math.random() * 8)];
  g = colors[Math.floor(Math.random() * 8)];
  b = colors[Math.floor(Math.random() * 8)];
  return '#' + r + g + b;
};

$(function() {
  $('span.number').each(function() {
    this.style.color = random_rgb();
  });
});

edited Mar 24, 2016 at 13:34

answered Mar 24, 2016 at 13:27

Novocaine

4,8064 gold badges48 silver badges68 bronze badges

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

Comments

The Process · Accepted Answer · 2016-03-24 13:35:07Z

Guess you need something like this, you had a few errors in your random_rgb() function.
Also jquery way would be $(this).css('color',random_rgb());

function random_rgb() {
  colors = ['8', '9', 'a', 'b', 'c', 'd', 'e', 'f'];
  r = colors[Math.floor(Math.random() * 8)];
  g = colors[Math.floor(Math.random() * 8)];
  b = colors[Math.floor(Math.random() * 8)];
  return '#' + r + g + b;
}

$("span.number").each(function() {
  this.style.color = random_rgb();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span class="number">Some Long Text</span>
<span class="number">Some Long Text</span>
<span class="number">Some Long Text</span>
<span class="number">Some Long Text</span>
<span class="number">Some Long Text</span>
<span class="number">Some Long Text</span>
<span class="number">Some Long Text</span>

SnakeFoot · Accepted Answer · 2016-03-24 13:29:08Z

0

shoud return something like :return rgb(255, 0, 0) or try this:

$(document).ready(function () {

  $('div').css('background',randrgb());
})

edited Mar 24, 2016 at 13:29

answered Mar 24, 2016 at 13:21

SnakeFoot

1741 gold badge3 silver badges17 bronze badges

1 Comment

listenlight Over a year ago

Sorry, the function says rgb but I want a hex value.

Collectives™ on Stack Overflow

Change text to pseudo-random color using jquery

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related