diff --git a/default.hbs b/default.hbs
index ce4a0c5..55bacf0 100644
--- a/default.hbs
+++ b/default.hbs
@@ -27,20 +27,6 @@
 
     {{> "footer"}}
 
-    <script>
-      let sections = document.querySelectorAll('.section-header');
-      function handleClick(event) {
-        const isActive = event.currentTarget.parentNode.classList.contains("active");
-        if (!isActive) {
-          event.currentTarget.parentNode.classList.add("active");
-        } else {
-          event.currentTarget.parentNode.classList.remove("active");
-        }
-      }
-      sections.forEach(function(section) {
-        section.addEventListener("click", handleClick);
-      });
-    </script>
     {{!-- Outputs important scripts - should always be included before closing body tag --}}
     {{ghost_foot}}
   </body>
diff --git a/src/js/app/index.js b/src/js/app/index.js
index f3cec64..a5d6079 100644
--- a/src/js/app/index.js
+++ b/src/js/app/index.js
@@ -1,6 +1,12 @@
 import "../../css/app.css"
 import './navigation-top';
 
+document.querySelectorAll('.section-header').forEach((header) => {
+    header.addEventListener('click', function () {
+        this.parentNode.classList.toggle('active');
+    });
+});
+
 // LiveReload server
 if (ENV === 'development') {
   const script = document.createElement('script');