title: How to save toggle switch in Chrome Extension
body: <p>I am trying to create a Chrome extension which shows notifications after every hour. To receive notifications you must toggle a switch from the popup menu, however, right now once I toggle the switch and close the popup and then open the popup back up it shows the switch as off. Once the user turns the switch on it should remain on until the user turns it off again. I am using Javascript by the way. Any help on this?</p>
  <img src="https://i.stack.imgur.com/Fxqkx.png" />
  <pre><code>if (checkbox.checked) {
      // this means the app is on and should display a notification every hour
  } else {
      //this means the app is off and should NOT display a notification every hour
  }
  
  </code></pre>
  <p><strong>Update</strong></p>
  <p>I've tried all suggestions yet the everytime I reopen the popup the switch changes back to off. I think it might be something with my html? I have included it below:</p>
  <pre><code>   input:checked+.slider:before {
          -webkit-transform: translateX(100px);
          -ms-transform: translateX(100px);
          transform: translateX(90px);
      }
  
      .slider:after {
          content: 'Turn on notifications';
          color: white;
          display: block;
          position: absolute;
          transform: translate(-50%, -50%);
          top: 50%;
          left: 50%;
          font-size: 12px;
          font-family: 'Candara';
  
      }
  
      input:checked+.slider:after {
          content: 'Turn off notifications';
      }
  </code></pre>
  <p>+++++++++++++++++++</p>
  <pre><code>        &lt;div&gt;
              &lt;label class=&quot;switch&quot;&gt;&lt;input type=&quot;checkbox&quot; id=&quot;togBtn&quot;&gt;
                  &lt;div class=&quot;slider round&quot;&gt;&lt;/div&gt;
              &lt;/label&gt;
          &lt;/div&gt;
  </code></pre>
  <p><strong>JS</strong></p>
  <pre><code>document.addEventListener('DOMContentLoaded', function () {
      var checkbox = document.querySelector('input[type=&quot;checkbox&quot;]');
  
  
  
      checkbox.addEventListener('click', function () {
  
          if (checkbox.checked) {
            
              checkbox.addEventListener('click', function () {
                  chrome.storage.local.set({ 'enabled': checkbox.checked }, 
                   function () {
                      console.log(&quot;confirmed&quot;);
                  });
              })
  </code></pre>