ejercicio3

clase-9.js

@@ -32,6 +32,23 @@ campo.addEventListener("input", (e) => {
 //  hacer que al hacer clic en cualquier ítem se le agregue la clase "seleccionado"
 //  y se la quite a los demás (es decir, solo un ítem puede estar seleccionado a la vez).
 
+let ulPaises = document.querySelector('#lista-paises'); // aignamos la ul en una variable
+let arrayPaises = document.querySelectorAll('.pais'); // y los li en un array
+
+ulPaises.addEventListener('click', (e) => {
+    let paisElegido = e.target;
+    let listaPaisesNoelegidos =[];
+
+    paisElegido.classList.replace('pais', 'seleccionado'); //cambiamos la clase del pais seleccionado
+
+    console.log(paisElegido.classList);
+    for (let item of arrayPaises){
+        if (item.classList != 'seleccionado'){
+            item.remove();
+        }
+    }
+
+})
 
 
 // 4 Agregar a la página los siguientes elementos:

index.html

@@ -24,6 +24,13 @@
         <hr>
         <div id="ejercicio-3">
             <!-- Agregar acá el código HTML que haga falta para el ejercicio 3 -->
+             <p>Elige tu candidato para la copa del mundo:</p>
+             <ul id="lista-paises">
+                <li class="pais" id="esp">Espana</li>
+                <li class="pais" id="eng">Inglaterra</li>
+                <li class="pais" id="fra">Francia</li>
+                <li class="pais" id="arg">Argentina</li>
+             </ul>
         </div>
         <hr>
         <div id="ejercicio-4">