const container = document.querySelector('.container');
const songsContainer = container.querySelector('.songs-container');
const addButton = container.querySelector('.input__btn_add');
const resetButton = container.querySelector('.input__btn_reset');

function renderAdded() {
  const songs = songsContainer.querySelectorAll('.song');

  if (songs.length === 0) {
    resetButton.setAttribute('disabled', true);
    resetButton.classList.add('input__btn_disabled');
  } else {
    resetButton.removeAttribute('disabled');
    resetButton.classList.remove('input__btn_disabled');
  }
}

function addSong() {
  songsContainer.innerHTML += `
		<div class="song">
		  <h4 class="song__artist">Кино</h4>
		  <p class="song__title">Дерево</p>
		  <button class="song__like"></button>
		</div>
  `;

  renderAdded();
}

addButton.addEventListener('click', addSong);

renderAdded();