I require help in making this code work so as to show different colors and message when the required button is clicked/ hovered on

I would like to: 

1. Change the background of the page when the button `'colours'` is hovered upon
2. Show a message when button `'msg'` is clicked upon

As I am a beginner I don't know what actually wrong with the code but the function doesn't initiate by itself is all I know 

```
<!DOCTYPE html>
<html>

<head>
  <title></title>
</head>
<script language="javascript">
  function f1() {
    document.bgcolor = "blue";
    window.setTimeout("f2", 1200);
  }

  function f2() {
    document.bgcolor = "indigo";
    window.setTimeout("f3", 1200);
  }

  function f3() {
    document.bgcolor = "voilet";
    window.setTimeout("f4", 1200);
  }

  function f4() {
    document.bgcolor = "green";
    window.setTimeout("f5", 1200);
  }

  function f5() {
    document.bgcolor = "purple";
    window.setTimeout("f6", 1200);
  }

  function f6() {
    document.bgcolor = "yellow";
    window.setTimeout("f7", 1200);
  }

  function f7() {
    document.bgcolor = "orange";
    window.setTimeout("f8", 1200);
  }

  function f8() {
    document.bgcolor = "red";
    window.setTimeout("f1", 1200);
    f1();
  }

  function msg() {
    window.status = "display 7 distinct colours"
  }
</script>

<body>
  <center>
    <input type="button" name="b1" value="colors" onMouseOver="f1()">
    <input type="button" name="b2" value="msg" onClick="msg()">
  </center>
</body>

</html>

```