javascriptを勉強しようと思い、下記の本に載っているコードを試しております。

「これからwebをはじめる人のHTML＆CSS、Javascriptのきほんのきほん」 - タイマー作成

しかし同じコードを書いているのにもかかわらず、①時間が取得できず、②innerHTMLプロパティメソッドを使ったHTMLでかいているp要素の時間表示の塗替えができておりません。

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width">
    <title>TIMER</title>
    <link rel="stylesheet" type="text/css" href="style.css">
</head>

<body>
    <div class="container">
        <p id="timer">00:00:00</p>
    </div>

    <div>
        <button id="start_stop" class="btn btn-lg btn-danger">START</button>
    </div>

    <script>
        var now = new Date();
        var seconds = now.getSeconds();
        //getSecondsメソッドは現在の秒を取得できるDateオブジェクトのメソッド。実体化したことでそのメソッドがnowから(now.)使うことができるイメージ//
        if (seconds < 10) {
            seconds = '0' + seconds;
        }
        //↑とりあえず「秒」の部分を２桁表示をさせるには//
        var minutes = now.getMinutes();
        if (minutes < 10) {
            minutes = '0' + minutes;
        }
        var hours = now.getHours();
        if (hours < 10) {
            hours = '0' + hours;
        }
        document.getElementById('timer').innerHTML=hours+':'+minutes+':'+seconds;
    </script>

</body>
</html>

何卒よろしくお願いいたします