JavaScript Will Not Load After DOM

Question

I'm having trouble getting my JS to run after all my content has loaded. Right now on the site Im working on: http://hsvgridproject.com , the grid will not load the first time a user visit the site and needs a hard refresh before it will work. I believe I need to use a window.onload function of some sort but as I am still learning Java I'm not sure how to implement it into my project without breaking the code.

The script for the grid on homepage has a window tag surrounding it already (credit Codrops):

(function(window) {

Please let me know if you need more info. Thank you!

Answer 1

It's probably not working because you're executing your script before the DOM is fully loaded.

To ensure it's executed after the DOM is fully loaded, either move the script tag which executes your code right before the closing tag of the body element or use DOMContentLoaded event like this:

document.addEventListener("DOMContentLoaded", function(event) {
    // execute your code
});