переменная принимает значение null, когда та существует только тогда, когда вызвано pop-up окно

у меня есть pop-up окно. Этот поп-ап в html выглядит так:

<section class="popap popap_opened">
<template id="template-popap">
<form class="popap__container">
<span class="popap__close"></span>
<h2 class="popap__title"></h2>
<input type="text" class="popap__input-name" placeholder="">
<input type="text" class="popap__input-signature" placeholder="">
<button type="submit" class="popap__input-save">
<p class="popap__text-color"></p>
</button>
</form>
</template>
</section>

соответственно и принимает этот pop-up значения инпутов через js выгляlит это таким образом:

  function popapToggle() {
  popap.classList.toggle('popap_opened');
  const templatePopap = popap.querySelector('#template-popap').content;
  const popapElement = templatePopap.cloneNode(true);
  popapElement.querySelector('.popap__title').textContent = 'Редактировать профиль';
  popapElement.querySelector('.popap__input-name').placeholder = 'Имя';
  popapElement.querySelector('.popap__input-signature').placeholder = 'О себе';
  popapElement.querySelector('.popap__text-color').textContent = 'Сохранить';
  popap.append(popapElement);
} 

И теперь суть проблемы : у поп-ап окна есть кнопка "крестик", которая, конечно, отвечает за закрытие поп-ап окна. Я Хочу на кнопку "крестик" повесить событие, что если нажать по крестику, то попап окно закроется и кнопки примут значение , что прописано в разметке. Код выглядит так:

//кнопка в форме "Крестика"
const btnClose = popap.querySelector('.popap__close');
btnClose.addEventListener('click', () => {
  popap.classList.toggle('popap_opened');
  nameInput.value = profileName.textContent;
  jobInput.value = profileJob.textContent;
});

Но этот код не срабатывает и в консоле вылезает ошибки такого вида: TypeError: btnClose is null Читать мы все умеем, вылетает ошибка,что у меня переменная задана, но она принимает значение null пушто поп-апа то по сути на странице нет (он пока находится в шаблоне , который будет доступен только по вызову), эта переменная обретет значение только если поп-ап сразу был бы открытым. Пытался прописать условие в ф-ю if( typeof btnClose !== 'null') { popap.classList.toggle('popap_opened')} , все равно не работает. Каким образом мне решить данную проблему, ребят?