Как проверять не поменялся ли location.href

У меня проблема с расширением для youtube.com. Скрипт выполняется только при первом посещении сайта.

Определил я это следующим образом. Скрипт в том числе показывает пользователю id-шник видео ${$('meta[itemprop=videoId]').attr('content')}. Если переходить по ссылкам сайта дальше, то на страницах остается id-шник самого первого видео.

window.addEventListener('load', function(){

    function injectScript() {
       
      if(document.querySelector('#a') === null && document.querySelector('#player.style-scope') !== null){
        
        Array.from(document.querySelectorAll('#player')).pop().insertAdjacentHTML("afterend", `<div id="a" style="color:red">${$('meta[itemprop=videoId]').attr('content')}</div>`);

        // Код

      }
    }

    const  element = document.querySelector('body');

    function childList(list){
      injectScript();
    }

    let callback = function(mutations, observer) {
      mutations.forEach(function(mutation) {
        if(mutation.type === 'childList'){
          childList(mutation);
        }
      });
    }

    const mutationObserver = new MutationObserver(callback);

    const config = {
      childList: true,
      subtree: true
    };
    mutationObserver.observe(element, config);

})

Вижу 2 направления:

1. Можно ли получать id-шник другим способом, который не зависит от загрузки скрипта? Хотя это вряд ли реально.
2. Получается что сайт подтягивает данные через fetch. Говорят что можно использовать в таком случае location.href?

Последнюю неделю я искал и пробовал варианты второго направления, но ничего в них так и не понял, знаний не хватает. Можете помочь?