Chosing a random color from an array and implementing the result to an HTML div

Question

so I have this loader animation div and I want it to change colour every time I refresh. I already have an array for the colours if needed: ["#c764b3", "#d55f5f", "5f92d5", "#6bd1aa", "#6fd55b", "#799b00", "#ce3434"] , but nothing seems to work, and I don't know why.

Thanks in advance.

What did you try that did not work? Were there error messages with that code? — epascarello, Oct 05 '20 at 17:53
No, it just wouldn't work, I basically tried something like this: https://stackoverflow.com/a/63080482/13061305 — filip, Oct 05 '20 at 17:56

score 1 · Answer 1 · answered Oct 05 '20 at 17:57

let colors = ["#c764b3", "#d55f5f", "#5f92d5", "#6bd1aa", "#6fd55b", "#799b00", "#ce3434"];

onload = function() {
  document.getElementById("color-div").style.backgroundColor = colors[Math.floor(Math.random() * colors.length)];
}

#color-div {
  width: 100px;
  height: 100px;
  margin: auto;
  border: 2px solid black;
  border-radius: 5px;
}

<div id="color-div"></div>

score 0 · Answer 2 · answered Oct 05 '20 at 17:58

0

This should do it!

`let colorArray = ["#c764b3", "#d55f5f", "5f92d5", "#6bd1aa", "#6fd55b", "#799b00", "#ce3434"];

let rc = Math.floor(Math.random() * colorArray.length);

console.log(rc);`

answered Oct 05 '20 at 17:58

Use three backticks for multiline code (or add a snippet using the snippet editor) – ElectricShadow Oct 05 '20 at 17:58

Chosing a random color from an array and implementing the result to an HTML div

2 Answers2