Javascript Element How to - Click span to Change random Color








Question

We would like to know how to click span to Change random Color.

Answer


<!DOCTYPE html>
<html>
<body>
  <span>Click to Change random Color</span>
  <br />
  <br />
  <div id="results"></div>
  <script type='text/javascript'>
    var body;
    var button;
    body = document.querySelector('body');
    button = document.querySelector('span');
    function changeColor() {<!-- w  w w  .  j a v a2s .c  o  m-->
        var color = '#'+Math.floor(Math.random()*16777215).toString(16);    
        body.style.background = color;
        document.getElementById('results').innerHTML += color + '<br />';
    }
    button.onclick = changeColor;
</script>
</body>
</html>

The code above is rendered as follows: