Кнопка в расширении Chrome ничего не делает

Question

Я работаю над расширением Chrome. Я пытаюсь реализовать кнопку, но она вообще не работает.

Я убедился, что скрипт находится в конце тела (после DOM), что все написано правильно и т. Д. Он даже работает копировать / вставлять в редактор W3Schools TryIt (с которым я также консультировался).

<button type="button" id="trackToggleButton" onclick="trackToggle()">T</button>

<!-- other stuff -->
<script>
      var trackingEnabled = true;
      function trackToggle() {
  if (true) {
    document.getElementById("trackToggleButton").innerHTML = "Tracking currently enabled. Click to disable.";
    trackingEnabled = false;
  } else {
    document.getElementById("trackToggleButton").innerHTML = "Tracking currently disabled. Click to disable.";
    trackingEnabled = true;
  }
</script>

Независимо от того, что я делаю, он полностью игнорирует скрипт и не изменяется от исходного значения. Опять же, он даже прекрасно работает в редакторе W3Schools TryIt.

РЕДАКТИРОВАТЬ: Получил работу. Я удалил onclick из тега кнопки и поместил его в отдельный файл .js:

function trackToggle() {
  if (trackingEnabled) {
    document.getElementById("trackToggleButton").innerHTML = "Tracking currently disabled. Click to enable.";
    trackingEnabled = false;
  } else {
    document.getElementById("trackToggleButton").innerHTML = "Tracking currently enabled. Click to disable.";
    trackingEnabled = true;
  }
}
document.getElementById("trackToggleButton").addEventListener('click', trackToggle);