// Agregar aquí el código javascript
// 1. Selección de los elementos del DOM mediante sus identificadores
const inputItem = document.getElementById("input-item");
const btnAgregar = document.getElementById("btn-agregar");
const listaContenedor = document.getElementById("lista-contenedor");

// 2. Registro del escuchador de eventos para el clic del botón
btnAgregar.addEventListener("click", function () {
    
    // 3. Captura y limpieza de espacios en blanco del valor actual del input
    const textoItem = inputItem.value.trim();

    // 4. Validación: si la cadena está vacía, se interrumpe la ejecución
    if (textoItem === "") {
        return; 
    }

    // 5. Creación de un nuevo elemento de lista (<li>) en memoria
    const nuevoLi = document.createElement("li");
    
    // 6. Asignación del texto validado al contenido del nuevo elemento
    nuevoLi.textContent = textoItem;

    // 7. Inserción del nuevo elemento como hijo del contenedor <ul>
    listaContenedor.appendChild(nuevoLi);

    // 8. Restablecimiento del campo de texto a una cadena vacía
    inputItem.value = "";
});