Using 2 different body background colors

Question

What would be the best way of doing 2 different background colors?

Code: https://playcode.io/test4343?tabs=index.html,preview

When it's first viewed it's one color,

https://i.imgur.com/gQVK7r8.png

After you click on circle, if I wanted to give it a different color how would I do that?

https://i.imgur.com/oDe8raQ.png

body {
  background: #353198;
}

Answer 1

您必须在圆上使用onclick函数，然后在该函数中包含以下代码。

document.body.style.backgroundColor = "YOUR_DESIRED_COLOR"; 

Answer 2

you can use

document.getElementsByClassName("jacketa").addEventListener("click", myFunction());
function myFunction (){
document.body.style.background="red";
}