Bienvenido a Foros del Web.
Sucede que el código se interpreta de arriba hacia abajo, entonces, si el código JS se encuentra antes que los elementos a los cuales se quiere afectar, lo que sucederá será que primero cargará el código JS y luego los elementos del documento, generando que estos no se vean afectados por el código JS ya que no existían cuando el primero ya había cargado.
Una solución simple es colocar el código luego de todos los elementos, pero también puedes ejecutar una función luego de que carguen los elementos, momento en el cual se produce el evento
DOMContentLoaded.
Código Javascript
:
Ver originaldocument.addEventListener("DOMContentLoaded", function(){
//Instrucciones a ejecutar
}, false);
Cabe señalar que este evento se produce cuando han cargado los elementos del documento, mas no el contenido multimedia que pudiera haber, dígase fotografías, audio o vídeos.
P. D.: Como utilizas la librería jQuery, puedes usar el método
.ready() el cual tiene un comportamiento muy similar al
script señalado líneas arriba.
Código Javascript
:
Ver original$(document).ready(function(){
//Instrucciones a ejecutar
});
Un saludo