Как неоднократно добавить блок и добавлять кнопку, если инпут не пустой?

Как добавить блок неоднократно по нажатию кнопки? Код создания блока:

const $addBlock = document.createElement('div');
const $selectContacts = document.createElement('select');
const $phoneOption = document.createElement('option');
const $additionalPhoneOption = document.createElement('option');
const $emailOption = document.createElement('option');
const $vkOption = document.createElement('option');
const $twitterOption = document.createElement('option');
const $selectInput = document.createElement('input');
const $clearBtn = document.createElement('button');

$addBlock.classList.add('add-contact__contacts');
$selectContacts.classList.add('add-contact__select');
$selectInput.classList.add('add-contact__input');
$clearBtn.classList.add('add-contact__clear-input', 'btn-reset');

$selectContacts.append($phoneOption, $additionalPhoneOption, $emailOption, $vkOption, $twitterOption);
$addBlock.append($selectContacts, $selectInput, $clearBtn);

(Дополнение) Сначала, была такая функция для создания блока, но затем я ее убрал, т.к. не мог получить значение $selectInput:

function createAddBlock() {
  const $addBlock = document.createElement('div');
  const $selectContacts = document.createElement('select');
  const $phoneOption = document.createElement('option');
  const $additionalPhoneOption = document.createElement('option');
  const $emailOption = document.createElement('option');
  const $vkOption = document.createElement('option');
  const $twitterOption = document.createElement('option');
  const $selectInput = document.createElement('input');

  $addBlock.classList.add('add-contact__contacts');
  $selectContacts.classList.add('add-contact__select');
  $selectInput.classList.add('add-contact__input');

  $phoneOption.textContent = 'Телефон';
  $phoneOption.value = 'phone';
  $additionalPhoneOption.textContent = 'Доп. тел.';
  $additionalPhoneOption.value = 'additional-phone';
  $emailOption.textContent = 'Email';
  $emailOption.value = 'email';
  $vkOption.textContent = 'Vk';
  $vkOption.value = 'vk';
  $twitterOption.textContent = 'Twitter';
  $twitterOption.value = 'twitter';
  $selectInput.placeholder = 'Введите данные контакта';

  $selectContacts.append($phoneOption, $additionalPhoneOption, $emailOption, $vkOption, $twitterOption);
  $addBlock.append($selectContacts, $selectInput);

  return {
    $selectInput,
    $addBlock,
  };
}

Событие по клику, которое вставляет блок выше:

$btnAddContact.addEventListener('click', () => {
  $btnAddContact.insertAdjacentElement('beforebegin', $addBlock);

  $clearBtn.addEventListener('click', () => {
    $selectInput.value = '';
  })
})

Событие работает один раз, после уже не добавляет блоки. Что нужно исправить или дописать?

Также есть проблема с проверкой инпута на значение. Необходимо, чтобы проверка проходила по $selectInput. Если есть значение, то кнопка $clearBtn должна появиться, если значение пустое, то $clearBtn необходимо скрыть.

Пробовал так:

if ($selectInput.value.length !== 0) {
  $clearBtn.style.display = 'inline'
} else {
  $clearBtn.style.display = 'none'
}

Были еще такие варианты:

if ($selectInput.value) {
  $clearBtn.style.display = 'block';
}
if (!$selectInput.value) {
  $clearBtn.style.display = 'none';
}

Писал данный код и в событие по клику $btnAddContact.addEventListener, и после присоединения в $addBlock. Но код только скрывает кнопку, т.е. первое условие никогда не срабатывает. Помогите, пожалуйста.