The current code of the dynamic navigation generation

NewCode.js

document.addEventListener("DOMContentLoaded", function () {
  var content = getCorrectContent()
  var navigation = getCorrectNavigation()
  var cssRules = [ /* Array containing strings corresponding to CSS rules */ ]
  init()

  function init() {
    addNavigation()
    addNavigationEvents()
    addCSSRules(cssRules.join(""))
  }

  function addNavigation() {
    /**
     * Get the information out of the navigation
     * Hydrate the templates with the required data
     * concatenate the templates and prepend it to content
     **/
  }

  function addNavigationEvents() {
    // Attach EventListeners to the newly created navigation 
  }

  function addCSSRules(css) {
    // Create <style> element and append it to the head
  }
})