Si te das cuenta estás creando un solo elemento `option`, en la 4ª línea y el forEach hace referencia a ese mismo elemento en cada iteración. Es por eso que prevalece el último elemento de la iteración. La solución es mover esa línea de código dentro de la función lambda y el `appendChild()` también ya que sino agregarías una sola opción. Así: function consultarEdad() { fetch('http://localhost:3500/edadesMascotas') .then(response => response.json()) .then(data => // Lo que se encuentra aquí no se repite. Por lo que no es el lugar ideal // para llevar a cabo la creación de las opciones. // El forEach funciona como un ciclo, es decir, data.forEach(element => { // lo que está en este bloque se repite var option = document.createElement('option') option.innerHTML = `${element.edad}` container.appendChild(option) // Aquí es el lugar para seguir configurando tus objetos option option.addEventListener('click', () => { console.log(option.value) }) }) // El bloque llegó a su fin, lo que escribas aquí tampoco se repetirá ); } Te prongo una alternativa a asignar un `EventListener` "click" para cada opción como me lo sugeriste en los comentarios. El evento "click" no es el único que existe. Hay uno llamado "change" que puedes aplicar al `select`. Y es así como con un solo evento solucionas el problema: container.addEventListener("change", () => console.log(container.value)) o si lo que quieres es saber el índice de la opción seleccionada: container.addEventListener("change", () => console.log(container.selectedIndex))