Random Element Background Colors JavaScript CSS style properties updates with Random Hex Color

How to create JavaScript code that within one statement can be used to generate a random HEX value to easily change colors to page element background. Click a button change the element background and body background color with JavaScript code.

<!DOCTYPE html>

<html>

<head>

 <title>JavaScript </title>

</head>

<body>

 <div>

  <input type=”text”><br>

  <button>Click Me</button>

  <div class=”results”></div>

 </div>

 <script src=”code.js”></script>

</body>

</html>

const myInput = document.querySelector(‘input’);

const btn = document.querySelector(‘button’);

const output = document.querySelector(‘.results’);

output.style.width = ‘500px’;

output.style.height = ‘200px’;

btn.addEventListener(‘click’,changer);

function changer(e){

   const hexV = ‘#’ + Math.random().toString(16).slice(-6);

   myInput.value = `${hexV}`;

   output.style.backgroundColor = hexV;

   document.body.style.backgroundColor = ‘#’ + Math.random().toString(16).slice(-6);

   console.log(hexV);

}

WP Twitter Auto Publish Powered By : XYZScripts.com