title: .style only affecting 1 of all classes
body: <p>I have a simple function that should change the style of all elements of a specific class, but it only changes one class.</p>
  
  <pre><code>&lt;p class="test"&gt;Lorem ipsum dolor sit.&lt;/p&gt;
  &lt;small class="test"&gt;Lorem ipsum dolor sit. Lorem ipsum dolor sit.&lt;smallp&gt;
  &lt;button onclick="myFunction()"&gt;Click me&lt;/button&gt;
  
  var listEl = document.querySelector('.test');
  function myFunction() {
  
      listEl.style.color="red";
  }
  </code></pre>
  
  <p>Why does it only change one class? </p>