title: Javascript dark mode toggle not working with onClick
body: <p>main.js:</p>
  <pre><code>   function darkModeToggle() {
      var element = document.body;
      element.classList.add(&quot;darkmode&quot;);
      localStorage.setItem(&quot;mode&quot;, &quot;dark&quot;);
      let mode = localStorage.getItem('mode')
  
      if (mode === 'dark') {
          document.getElementById(&quot;darkmode-button&quot;).onclick = lightModeToggle();
          document.getElementById(&quot;darkmode-button&quot;).innerHTML = 'Light mode';
          localStorage.setItem(&quot;mode&quot;, &quot;light&quot;);
          return false
      }
  
  }
  
  
  function lightModeToggle() {
      var element = document.body;
      element.classList.remove(&quot;darkmode&quot;);
      localStorage.setItem(&quot;mode&quot;, &quot;light&quot;);
  
      let mode = localStorage.getItem('mode')
      console.log('Hello')
  
      if (mode === 'light') {
          localStorage.setItem(&quot;mode&quot;, &quot;dark&quot;);
  
          document.getElementById(&quot;darkmode-button&quot;).onclick = darkModeToggle();
          document.getElementById(&quot;darkmode-button&quot;).innerHTML = 'Dark mode'
      }
  
  }
  </code></pre>
  <p>I have a button in home.html</p>
  <p><code>&lt;button onClick='darkModeToggle' id='darkmode-button'&gt;Dark mode&lt;/button&gt;</code></p>
  <p>But this does not work.. I want to store the settings of the user if they want dark mode or light mode in the website..</p>
  <p>Why does my current code not work and how to fix it?</p>