chaining HTML5 classList API without (Jquery)

html, javascript

Solution

You can create chainability via a little object with chainable methods:

function classList(elt) {
  var list = elt.classList;

  return {
      toggle: function(c) { list.toggle(c); return this; },
      add:    function(c) { list.add   (c); return this; },
      remove: function(c) { list.remove(c); return this; }
  };

}

Then you can chain to your heart's content:

classList(elt).remove('foo').add('bar').toggle('baz')

Problem

Is there a way to chain HTML5 classList API chaining?. this will not work ``` var sidebar = document.querySelector("#sidebar"); sidebar.classList.toggle("active").classList.remove("hover") ``` while this will work ``` var sidebar = document.querySelector("#sidebar"); sidebar.classList.toggle("active"); sidebar.classList.remove("hover") ``` NOTE: NO jquery please

Original source