diff --git a/src/js/hero.js b/src/js/hero.js
index 64952202d..9b406ae4f 100644
--- a/src/js/hero.js
+++ b/src/js/hero.js
@@ -1,8 +1,9 @@
+// Hero navbar fades to the normal navbar color once scrolled.
 const navbar = document.getElementById('hero-navbar');
 const navbarBaseColor = 'is-dark';
 
 if (navbar) {
-    window.addEventListener('scroll', () => {
+	window.addEventListener('scroll', () => {
         if (window.scrollY > 0) {
             navbar.classList.add('is-freestanding');
             navbar.classList.add(navbarBaseColor);
@@ -14,6 +15,14 @@ if (navbar) {
 }
 
 // Handle random switch colors
-const colors = ["orangered", "deepskyblue", "yellow", "deeppink", "lime", "gray"];
-document.getElementById('LeftJoy').classList.add("switch-" + colors[Math.floor(Math.random() * colors.length)]);
-document.getElementById('RightJoy').classList.add("switch-" + colors[Math.floor(Math.random() * colors.length)]);
\ No newline at end of file
+const leftJoycon = document.getElementById('LeftJoy');
+const rightJoycon = document.getElementById('RightJoy');
+const colors = ['orangered', 'deepskyblue', 'yellow', 'deeppink', 'lime', 'gray'];
+
+if (leftJoycon) {
+    leftJoycon.classList.add('switch-' + colors[Math.floor(Math.random() * colors.length)]); 
+}
+
+if (rightJoycon) {
+    rightJoycon.classList.add('switch-' + colors[Math.floor(Math.random() * colors.length)]); 
+}