Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

JavaScript JavaScript Loops, Arrays and Objects Simplify Repetitive Tasks with Loops The Refactor Challenge, Part 2

Posted by john larson
john larson
16,594 Points

I tried putting the random number function inside the rgb function as a variable...

and I started getting only shades of grey. Can't imagine why. It looks to me like it should do the exact same thing. 

function rgbString(){
  var rgbValue = Math.floor(Math.random() * 256);
  return 'rgb('
    + rgbValue
    + ','
    + rgbValue
    + ','
    + rgbValue
    + ')'
}

var html = "";
for(var i = 0; i < 12; i += 1){
  html +=
  '<p style="background: '
  + rgbString()
  + ';" class="color">'
  + rgbString()
  + '</p>'
}

print(html)



```JavaScript


This code was fine when the random number was in a separate function.  Insights are welcome :D

1 Answer

Steven Parker
Steven Parker
231,269 Points
Steven Parker
Steven Parker
231,269 Points

Your rgbString function gets a single random number and then creates a color where each of the three values is set to that same value. This produces the random grays that you see.

:point_right: To get colors, one or more of the three RGB values must be different from the others.

Perhaps you meant to do something like this:

function rgbString(){
  var rValue = Math.floor(Math.random() * 256);
  var gValue = Math.floor(Math.random() * 256);
  var bValue = Math.floor(Math.random() * 256);
  return 'rgb(' + rValue + ',' + gValue + ',' + bValue + ')';
}