From 93fd449b17b3cbd28b950bcb1feecdbfd092d824 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Blas=20Alarc=C3=B3n?= <47840816@terciariourquiza.edu.ar>
Date: Thu, 21 May 2026 20:12:35 -0300
Subject: [PATCH] Cree una lista con cinco items, y use delegacion de eventos
 para que cuando haga click en un elemento agregue la clase seleccionado y se
 la quite a los demas

---
 clase-9.js | 15 +++++++++++++++
 index.html |  8 +++++++-
 2 files changed, 22 insertions(+), 1 deletion(-)

diff --git a/clase-9.js b/clase-9.js
index 50640d9..d7804ba 100644
--- a/clase-9.js
+++ b/clase-9.js
@@ -15,4 +15,19 @@ const parrafo2 = document.querySelector("#contadorCaracteres");
 campo.addEventListener("input", (e) => {
     parrafo2.textContent = `El campo de texto tiene ${e.target.value.length} caracteres`;
     console.log(e.target.value); 
+});
+
+const lista = document.querySelector("ul");
+
+lista.addEventListener("click", (e) => {
+    if (e.target.tagName === "LI") {
+        const items = document.querySelectorAll("li")
+        for (const item of items) {
+            item.classList.remove("seleccionado");
+        }
+
+        e.target.classList.add("seleccionado");
+        
+        console.log(e.target.textContent);
+    }
 });
\ No newline at end of file
diff --git a/index.html b/index.html
index 43bee2d..7bb9aeb 100644
--- a/index.html
+++ b/index.html
@@ -19,7 +19,13 @@
         </div>
         <hr>
         <div id="ejercicio-3">
-            <!-- Agregar acá el código HTML que haga falta para el ejercicio 3 -->
+            <ul>
+                <li>item 1</li>
+                <li>item 2</li>
+                <li>item 3</li>
+                <li>item 4</li>
+                <li>item 5</li>
+            </ul><!-- Agregar acá el código HTML que haga falta para el ejercicio 3 -->
         </div>
         <hr>
         <div id="ejercicio-4">