JavaScriptでsetIntervalを使う練習 #CSS

javascriptのsetIntervalと、jQueryを使用して、60秒タイマーアプリを作成
10秒間隔で、背景と文字色が変更する
html
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>real time</title>
    <style>
        body{
                margin: 100px auto;
                line-height: 180px;
                font-size: 18px;
                font-weight: bold;
                background-color:black;
        }
    </style>
</head>

<body>
    <div id="count"></div>
<script>
    function foo(x) {
        return (x < 10) ? '0' + x : x; }
    function clock(){
        var now   = new Date();
        var year  = now.getFullYear();
        var month = now.getMonth()+1;
        var date  = now.getDate();
        var h = now.getHours();
        var m = now.getMinutes();
        var s = now.getSeconds();
        var t =  foo(s);

        if(s>=0 && s<=9){
            document.querySelector("div").style.backgroundColor = "red";
            document.querySelector("div").style.color = "white";
        }else if(s>=9 && s<=19){
            document.querySelector("div").style.backgroundColor = "yellow";
            document.querySelector("div").style.color = "blue";
        }else if(s>=19 && s<=29){
            document.querySelector("div").style.backgroundColor = "green";
            document.querySelector("div").style.color = "white";
        }else if(s>=29 && s<=39){
            document.querySelector("div").style.backgroundColor = "white";
            document.querySelector("div").style.color = "black";
        }else if(s>=39 && s<=49){
            document.querySelector("div").style.backgroundColor = "darkorchid";
            document.querySelector("div").style.color = "yellow";
        }else if(s>=49 && s<=59){
            document.querySelector("div").style.backgroundColor = "blue";
            document.querySelector("div").style.color = "orange";
        }else{
            document.querySelector("div").style.backgroundColor = "black";
            document.querySelector("div").style.color = "orange";
            document.querySelector("div").fontSize = "100px";
        }
        document.querySelector("div").innerHTML = t;
        document.querySelector("div").style.fontSize = "150px";
        document.querySelector("div").style.textAlign = "center";
        document.querySelector("div").style.padding = "150px";
　　}
      setInterval(clock, 1000);
</script>
</body>
</html>