Удаление EventListener после его вызова

//---------------------------------------------------------------- 
// Можно так 
document.querySelector('.add').addEventListener('click', message); 
 
function message() { 
  let message = document.createElement('textarea'); 
  document.body.appendChild(message); 
} 
// Можно так  
document.querySelector('.del').removeEventListener('click', message); 
 
//---------------------------------------------------------------- 
// Кнопка удалить 
var del = document.querySelector(".del"); 
// Вешаем событие 
del.addEventListener("click", function() { 
  // Все созданные textarea 
  var textA = document.querySelectorAll('textarea'); 
  if (textA.length > 0) { // Если есть, что удалять 
    // Удалить последнее созданное поле 
    document.body.removeChild(textA[textA.length - 1]); 
  } 
})

span { 
  cursor: pointer; 
  margin: 10px; 
} 
 
span img { 
  width: 16px; 
  height: 16px; 
  margin-right: 5px; 
} 
 
textarea { 
  display: block; 
  margin: 30px 0 0 0; 
}

<!-------- Лучше так, класс каждому елементу, так читабельней --------> 
<span class="add">&#43; Создать сообщение 	</span> 
<span class="del">&#45; Удалить сообщение 	</span> 
<span class="edit">&#9998; Редактировать сообщение 	</span> 
<span class="save"><img src="https://cdn3.iconfinder.com/data/icons/text-icons-1/512/BT_save-512.png" alt="">Сохранить сообщение </span>