title: How to select element by 'role' attribute and filter by class with vanilla JS?
body: <p>Markup:</p>
  
  <pre><code>&lt;ul&gt;
    &lt;li role="presentation" class="active"&gt;
      &lt;a href="#1" aria-controls="1" role="tab"&gt;How to Install for iPad&lt;/a&gt;
    &lt;/li&gt;
    &lt;li role="presentation"&gt;
      &lt;a href="#2" aria-controls="2" role="tab"&gt;How to Install for Mac&lt;/a&gt;
    &lt;/li&gt;
    &lt;li role="presentation"&gt;
      &lt;a href="#3" aria-controls="3" role="tab"&gt;How to Install for PC&lt;/a&gt;
    &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>When I use <strong><em>document.querySelectorAll('[role="presentation"]');</em></strong>  the result is array 
  <em>[li.active,li,li]</em></p>
  
  <p>How can I remove .active class and attach it to any other of these li with plain JS w/o JQuery the more simplest way?</p>