Script loads a function before I call it locally but publicly it loads it after

Question

Sorry for the confusing title, but my sidenav on my portfolio website opens when I run the html page. When I use it on my website, it just says Uncaught ReferenceError: openNav is not defined at HTMLSpanElement.onclick ((index):23) onclick @ (index):23 which just leads me to where I'm calling the function. Is it because I'm loading the script after I call it? How come it works locally though?

Also I have my server going through Cloudflare if that's any help. I've also already tried uploading my local files and replacing the ones on the server completely, they were the exact same though.

One more also, I have the page on Github Pages as well and it works fine. Github Pages

EDIT: Relevent Code?:

 $(function(){$('[data-toggle="tooltip"]').tooltip();});$('.tool-tip').click(function(e){e.preventDefault();});const openNav=()=>{if($(window).width()>2000){document.getElementById("mySideNav").style.width="750px";}else{document.getElementById("mySideNav").style.width="250px";} document.getElementById("navTextWrapper").style.display="block";} const closeNav=()=>{document.getElementById("mySideNav").style.width="0";document.getElementById("navTextWrapper").style.display="none";} 

 <span class="openMenu" onclick="openNav();">&#9776;</span> <nav id="mySideNav" class="sidenav"> <div id="navTextWrapper"> <div class="navBrandExit"> <a href="#" class="brand">Kenneth Rhodes</a><a href="#" class="closeBtn" onclick="event.preventDefault(); closeNav();">&times;</a> </div> <a href="#showcase">Top</a> <a href="#perks">Skills</a> <a href="#portfolio">Portfolio</a> <a href="#contact">Contact</a> </div> </nav> 

Answer 1

Checking your website it seems js/main.js is not being loaded properly, can you try turning off Rocket Loader in cloudflare Performance Settings to see if it has any impact? You can get to your Performance Settings by going to:

Speed > Rocket loader