Не могу понять принцип работы таймера в JS

Хочу написать скрипт, который будет добавлять в заголовок символ доллара каждую секунду, 10 раз. Вот пример кода, почему таймер не останавливается? Как написать правильно, и если можно вкратце принцип работы таймера в JS, а то я видимо чего-то недопонимаю.

<body>
  <h1 style="text-align:center; font-family:Arial;" id="txt-head"></h1>

  <script>
    let count = 0;

    function printTxtHead() {
      document.getElementById('txt-head').innerHTML += "$";
      count++;
    }

    if (count < 10) {
      window.TimerId = window.setInterval(printTxtHead, 1000);
    } else {
      window.clearInterval(window.TimerId);
    }
  </script>
</body>


Ответы (1 шт):

Автор решения: UserTest013

Проверять count нужно внутри printTxtHead, снаружи проверка отработает только 1 раз.

let count = 0;
const timerId = window.setInterval(printTxtHead, 1000);

function printTxtHead() {
  document.getElementById('txt-head').innerHTML += "$";
  count++;
  if (count > 10) {
    window.clearInterval(timerId);
  }
}
<h1 style="text-align:center; font-family:Arial;" id="txt-head"></h1>

→ Ссылка