No logro acceder a un elemento.

[neoanderson]

Hola a todos.
Estoy queriendo terminar una página web con html,css y javascript.
Pero tengo este problema.
Tengo una función que se llama mostrar_precio que recibe un argumento que es un elemento y otro argumento que es el precio a insertar.
Yo paso "this" a la función esperando poder acceder al hijo de texto del hermano siguiente de su padre (elemento.parentElement.nextSibling.childNodes[1].innerHTML = precio;),pero no lo consigo.
La consola web de firefox me indicó la anterior instrucción "undefined".

Acá les paso el código y por favor explíquenme ¿por qué undefined?

Código HTML:

<div>
                <div>
                    <img src="../img/sublineas/ojos/sombra-individual.jpg"><span>SOMBRAS COMPACTAS INDIVIDUALES.<br />Sombras para ojos de gran cobertura, aterciopeladas y con excelente deslizamiento. Su textura sedosa facilita la aplicaci&oacute;n perfecta del color. Con ingredientes de polvo altamente micronizados que garantizan un maquillaje duradero. Pueden combinarse con otros tonos para crear m&uacute;ltiples combinaciones de color y diferentes looks de tendencia. Contienen vitamina E y filtro solar.</span>
                </div>
                <div>
                    <img src="../img/COL128700D.jpg"><img src="../img/COL128800D.jpg"><img src="../img/COL131700D.jpg">
                </div>
                <div>
                    <a href="#">A&ntilde;adir al carrito</a>
                    <span>$43,50.</span>
                </div>
                <div>
                    <img src="../img/sublineas/ojos/sombra-duo.jpg"><span>Sombras compactas d&uacute;o.<br />La combinaci&oacute;n perfecta de dos colores para lograr una mirada cautivante. Su textura sedosa permite un trabajo preciso de los colores y el aplicador de punta aterciopelada difumina perfectamente la sombra. Para lograr el efecto deseado, primero se recomienda aplicar el tono m&aacute;s claro sobre el p&aacute;rpado, y luego, difuminar el tono m&aacute;s oscuro en el pliegue del ojo.</span>
                </div>
                <div>
                    <img src="../img/COL130300D.jpg" onmouseover="mostrar_precio(this,'52,90')"><img src="../img/COL130500D.jpg" onmouseover="mostrar_precio(this,'52,90')"><img src="../img/COL128400D.jpg" onmouseover="mostrar_precio(this,'114,90')">
                </div>
                <div>
                    <a href="#">A&ntilde;adir al carrito</a>
                    <span>$114,90.</span>
                </div>
                <div>
                    <img src="../img/sublineas/ojos/mascaras.jpg"><span>M&aacute;scaras de pesta&ntilde;as.<br />Tres colores arm&oacute;nicamente combinados para lograr un look sofisticado. Su textura sedosa permite un trabajo preciso de los colores y el aplicador de punta aterciopelada difumina perfectamente la sombra. Para lograr el efecto deseado, primero se recomienda aplicar el tono m&aacute;s claro sobre el p&aacute;rpado y difuminarlo con el tono medio hacia el costado exterior; luego, lograr profundidad aplicando el tono m&aacute;s oscuro en el pliegue del ojo.</span>
                </div>
                <div>
                    <img src="../img/COL140100D.jpg">&nbsp;<img src="../img/COL140800D.jpg">&nbsp;<img src="../img/COL140800D.jpg">
                </div>
                <div>
                    <a href="#">A&ntilde;adir al carrito</a>
                    <span>$94,90.</span>
                </div>
                <div>
                    <img src="../img/sublineas/ojos/delineadores.jpg"><span>Delineadores de ojos.<br />F&oacute;rmulas excepcionales para lograr pesta&ntilde;as m&aacute;s fuertes, sanas y visiblemente m&aacute;s largas. Cero grumos. Contienen pigmentos naturales y fibras de seda que aumentan el volumen de las pesta&ntilde;as. Sus pinceles est&aacute;n especialmente dise&ntilde;ados para generar una definici&oacute;n de alto impacto. Variedad de tonos.</span>
                </div>
                <div>
                    <img src="../img/COL154700D.jpg" onmouseover="javascript:documentElement.nextSibling.childNodes[1].innerHTML='59,90';">&nbsp;<img src="../img/COL154800D.jpg" onmouseover="mostrar_precio(this,'23,90')"><img src="../img/COL152500D.jpg" onmouseover="mostrar_precio(this,'59,90')"><img src="../img/COL153000D.jpg" onmouseover="mostrar_precio(this,'34,90')">
                </div>
                <div>
                    <a href="#">A&ntilde;adir al carrito</a>
                    <span>$94,50.</span>
                </div>
            </div>
        </div>
    </body>
</html>
 

Acá está el pequeñísimo código javascript:

Código Javascript:

function mostrar_precio(elemento,precio) {
    elemento.parentNode.nextSibling.childNodes[1].innerHTML = precio;
}
 

Les agradezco.