aceder a la etiqueta de una capa

[pithon]

No consigo aceder a la segunda etiqueta de una capa en este caso es un h3, me crea conflicto con los demas que estan fuera de esa capa, lo hice de esta forma.

Código Javascript:

<h3>titulo fuera de la capa</h3>
<div id='capa'>
    <h3>contenido h3</h3>
</div>
 
<script>
capa=document.getElementById("capa");
capa.getElementsByTagName('h1')[0].style.color="red";
</script>
 

no me esta funcionando, que esta pasando, saludos.

[Alexis88]

Si quieres tomar al <h3>, ¿por qué intentas tomar a un <h1>?

De cualquier forma, eso podrías hacerlo de una manera más sencilla con CSS:

Código CSS:

#capa h3{
    color: red;
}
 

Saludos

[pithon]

Hola Alexis88, tube un error al escribir por eso puse el h1, quiero que cambie de color al pulsar un boton pr eso uso javascript, en fin me di cuenta que el error esta en otra parte del codigo, al insertar un h3 encima del existente en dicha capa, pongo ejemplo.

Código Javascript:

<h3>titulo fuera de la capa</h3>
<div id='capa'>
    <h3>contenido h3</h3>
</div>
 
<script>
capa=document.getElementById("capa");
titulo = capa.getElementsByTagName('h3')[0];
contenido=document.createTextNode("nuevo titulo");
titulo2=document.createElement('h3');
titulo2.appendChild(contenido);
capa.insertBefore(titulo2,titulo);
capa.getElementsByTagName('h3')[0].style.color="red";
</script>
 

intento insertar un h3 dentro del div encima del h3 existente, funciona bien pero despues al cambiar de color no me lo cambia me dice que capa no esta definido, la ultima linea del javascript, alguna idea saludos.

[Alexis88]

Debe de haber algo más que no estamos viendo porque probando lo que pones, funciona sin problemas.

Saludos