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

Colin Sandlin
Colin Sandlin
4,509 Points

Colors not showing up

var html = '';
var rgbColor;


function colorGenerator() {
  var generatedColor = Math.floor(Math.random() * 256 );
  return generatedColor;
}


function colorCombo() {
  var color = 'rgb(';
  color += colorGenerator() + ',';
  color += colorGenerator() + ',';
  color += colorGenerator() + ')';
  return color;
}

for (var i = 1; i < 11; i++) {
  rgbColor = colorCombo();
  html += '<div style="background-color:' + rgbColor + '"></div>';
}

1 Answer

Dario Bahena
Dario Bahena
10,688 Points

Very close. It is missing some padding to show the content. Otherwise, it is just creating divs without sizes.

var html = '';
var rgbColor;


function colorGenerator() {
  var generatedColor = Math.floor(Math.random() * 256 );
  return generatedColor;
}


function colorCombo() {
  var color = 'rgb(';
  color += colorGenerator() + ',';
  color += colorGenerator() + ',';
  color += colorGenerator() + ')';
  return color;
}

// added missing padding so that the divs are visible
for (var i = 1; i < 11; i++) {
  rgbColor = colorCombo();
  html += '<div style="background-color:' + rgbColor + ';padding: 10px;"></div>';
}
// write to the document so content is displayed
document.write(html)