(ej3) terminado

clase-9.js

@@ -16,4 +16,17 @@ let Letras = 0;
 cajaTexto.addEventListener("input", () => {
     Letras += 1;
     conatdorLetras.textContent = `Letras escritas = ${Letras} `;
+});
+
+3//
+const lista = document.getElementById("ListaMarcasExoticas");
+lista.addEventListener("click", function(evento) {
+    if (evento.target.tagName ==="LI") {
+        const itemPrevio = lista.querySelector(".seleccionado");
+        if (itemPrevio) {
+            itemPrevio.classList.remove("seleccionado");
+        }
+        evento.target.classList.add("seleccionado");
+
+    }
 });

estilo.css

@@ -3,3 +3,6 @@ div {
     padding: 10px;
     margin: 10px;
 }
+.seleccionado{
+    background-color:blue;
+}

index.html

@@ -21,7 +21,13 @@
         <hr>
         <div id="ejercicio-3">
             <!-- Agregar acá el código HTML que haga falta para el ejercicio 3 -->
-        </div>
+            <ul id="ListaMarcasExoticas">
+                <li>Lotus</li>
+                <li>Panoz</li>
+                <li>G.M.A</li>
+                <li>Pagani</li>
+                <li>Maseati</li>
+            </ul>
         <hr>
         <div id="ejercicio-4">
             <!-- Agregar acá el código HTML que haga falta para el ejercicio 4 -->