Модальное не работает, если одна из двух модальных кнопок исчезла из-за ограничения кода

Question

1. У меня есть две модальные кнопки для определения цены: одна для более низкой цены, а другая для более высокой цены.
2. Если кто-то заплатил за более низкий продукт.Нижняя модальная кнопка исчезает, но он все еще может видеть модальную кнопку выше.
3. Если кто-то заплатил за более высокий продукт, обе модальные кнопки исчезнут.
4. Теперь, если пользователь вообще не заплатил, он / она может видеть обе модальные кнопки и с моим нынешним кодированием оба модальных режима.работает нормально.

var modal = document.getElementById('myModal');
var modal2 = document.getElementById('myModal2');

var btn = document.getElementById("modalbutton");
var btn2 = document.getElementById("modalbutton2");

var span = document.getElementsByClassName("close")[0];
var span2 = document.getElementsByClassName("close2")[0];

btn.onclick = function() {
    modal.style.display = "block";
}
 btn2.onclick = function() {
    modal2.style.display = "block";
}

span.onclick = function() {
    modal.style.display = "none";
}
span2.onclick = function() {
    modal2.style.display = "none";
}

HTML: 

<button class="btn btn-default" id="modalbutton">Purchase low</button>
   <button class="btn btn-default" id="modalbutton2">Purchase high</button>







        

Проблема:

1. Когда пользователь заплатил за низкий уровень, кнопка низкого уровня исчезает, но кнопка модального режима длявыше остается.Но при нажатии на нее модальное окно не открывается.

2. Ошибка:

Uncaught TypeError: Невозможно установить свойство 'onclick' для null в

btn.onclick = function() {
      modal.style.display = "block";
    }

Почему это происходит для btn, а не напрямую для btn2.Как я могу исправить это.Спасибо.

Answer 1

Я думаю, что нашел ответ на обработку нуля.Поэтому я поставил чек,

if (btn !== null){
  btn.onclick = function() {
  modal.style.display = "block";
 }
}else{
  btn2.onclick = function() {
  modal2.style.display = "block";
 }
}

Модал открывается.После этого он показал ошибку при нажатии на событие закрытия.Заявление о низкой кнопке было неопределенным.поэтому я поставил чек на это тоже

if (span !== undefined){
 span.onclick = function() {
 modal.style.display = "none";
 }
}else{
 span2.onclick = function() {
 modal2.style.display = "none";
 }
}

Это своего рода обработка ошибок.Если у кого-то есть лучший способ справиться с этим.пожалуйста, поделитесь.