title: the for loop exit after it has been executed one time
body: <p>the <strong>for</strong> loop in the following code exit after removing one class and doesn't remove the other one unless I click the button again</p>
  <p>I want to remove the class <strong>hidden</strong> from 2 divs but I don't want to use <strong>querySelectorAll</strong>.</p>
  <p>is there any way to do it using <strong>getElementsByClassName</strong> and <strong>for</strong> loop, without JQuery <strong>Just JavaScript</strong></p>
  <p>I did the same thing before but it was to change the style of something not to add or remove classes.</p>
  <pre><code>
  var items = document.getElementsByClassName('hidden');
  
  let show = document.querySelector('.show-modal');
  
  show.addEventListener('click', function(){
      for (let i = 0; i &lt; items.length; i++){
          items.item(i).classList.remove('hidden');  
      }
  }); 
  
  </code></pre>