Tengo un select como este:
<select>
<option value="light">
<p id="p1">Claro</p>
</option>
<option value="dark">
<p id="p2">Oscuro</p>
</option>
</select>
Y un array
con elementos como este:
const messages = ["Light", "Dark"];
Lo que pasa es que intento cambiar el innerHTML
a los elementos p
dentro de los option
por cierto elemento del array
:
document.getElementById("p1").innerHTML = messages[0];
document.getElementById("p2").innerHTML = messages[1];
Todo bien con el array. El problema es que no me cambia el texto, y en la consola dice: null is not an object
, lo que quiere decir que no encontró mi elemento dentro del option
. No es error de carga del JavaScript, ya que tengo la costumbre de cargar JavaScript al final del body.
¿Alguien sabe cómo arreglar esto o al menos cómo cambiar un tramo de texto de un option
en JavaScript?
Gracias de antemano y espero que me puedas ayudar. ¡Ten un lindo día (o noche)!