title: How to remove a class from elements in pure JavaScript?
body: <p>I would like to know how to select all elements with class names "widget" and "hover" and then remove class "hover" from these elements.</p>
  
  <p>I have the following JavaScript code that selects all elements with class "widget" and "hover":</p>
  
  <pre><code>var elements = document.getElementsByClassName('widget hover');
  console.log(elements);
  </code></pre>
  
  <p>This seems to work and outputs something like this (with no errors):</p>
  
  <pre><code>[div#.widget... 
  </code></pre>
  
  <p>The problem is that if I try to remove the class "hover", I get an error:</p>
  
  <pre><code>var elements = document.getElementsByClassName('widget hover');
  console.log(elements);
  elements.classList.remove("hover");
  </code></pre>
  
  <p>This outputs:</p>
  
  <pre><code>[item: function]
  length: 0
  Uncaught TypeError: Cannot call method 'remove' of undefined 
  </code></pre>
  
  <p>Can anyone tell me what I'm doing wrong? </p>
  
  <p><br>
  Please note that I have it working in jQuery:</p>
  
  <pre><code>$('.widget.hover').removeClass('hover');
  </code></pre>
  
  <p>... but I'm looking for a solution in pure JavaScript.</p>