Background isn't changing every 1.5 seconds


I’m trying to get the background color to change every 1.5 seconds. The colors are supposed to be randomly generated and appear on the body of the page. :sleepy:


window.onload = bgColor(){
  function bgColor(){
    var rgb1 = Math.floor(Math.random() * Math.floor(255));
    var rgb2 = Math.floor(Math.random() * Math.floor(255));
    var rgb3 = Math.floor(Math.random() * Math.floor(255)); = "rgb(" + rgb1 + ', ' + rgb2 + ', ' + rgb3 + ')';
  setInterval(bgColor, 1500);


  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>Mortgage Calculator</title>
  <link rel="stylesheet" type="text/css" href="C:\\Users\\Brittany\\Documents\\randomProjectsCoding\\mortgageCalculator.css">
  <script src="C:\\Users\\Brittany\\Documents\\randomProjectsCoding\\mortgageCalculator.js" type="text/javascript"></script>
    <h1>Mortgage Calculator</h1>
    <label for="homeValue">Mortgage Amount: </label><input id="homeValue" type="text"><label for="homeValue"> $</label>
    <label for="iR">Interest Rate: </label><input id="iR" type="text"><label for="iR"> $</label>


from the docs:

window.onload = funcRef;

funcRef is the handler function to be called when the window’s load event fires.

its the same as you used earlier:

document.getElementById("submit").addEventListener("click", calculate);

you just specify the function you would like to call, in this case that would be bgColor.

you shouldn’t define the function at the onload event.