title: Disable/Enable CSS on webpage using Javascript
body: <p>According to <a href="https://stackoverflow.com/questions/9252839/simplest-way-to-remove-all-the-styles-in-a-page">This page</a> I was able to remove all the CSS preloaded and added on the webpage using that. I wanted to implement a button system where "<code>onclick</code>" = <code>enable/disable</code> webpage CSS even the ones pre-loaded by my web-host. I would like to eliminate the style tags to prevent lags for my website users.  I prefer using the script that I have linked above unless there is another alternative that works better. Is it possible to enable CSS onclick the same button to disable? If not is it possible, can it be done with this quick? example with the preferred script below:</p>
  
  <pre><code>if (disable) {
  style = "disable";
  } else {
  location.reload();
  }
  </code></pre>
  
  <p><strong>PREFERRED SCRIPT:</strong></p>
  
  <pre><code>function removeStyles(el) {
    el.removeAttribute('style');
  
    if(el.childNodes.length &gt; 0) {
      for(var child in el.childNodes) {
          /* filter element nodes only */
          if(el.childNodes[child].nodeType == 1)
              removeStyles(el.childNodes[child]);
      }
    }
  }
  
  removeStyles(document.body);
  </code></pre>