title: Pure Javascript how to select all selectors but NOT this
body: <p>How to use pure javascript to select all <code>.dummy</code> classes but NOT <code>THIS</code>? 
  I searched a while but can't find the answer I want. </p>
  
  <p>e.g. if I click the first <code>.dummy</code> div, I want to select all <code>.dummy</code> divs but not the one I clicked.</p>
  
  <p>jQuery way to achieve is like below, </p>
  
  <pre><code>var $dummy = $('.dummy');
  $dummy.on('click', function(){
      $dummy.not(this).......
  });
  </code></pre>
  
  <p>But I'd like to know how to achieve it by using pure javascript </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>document.querySelectorAll('.dummy').forEach(function(e, i){
    e.addEventListener('click', function(){
      console.log(document.querySelectorAll('.dummy').not(this)); 
      // WRONG not working, also querySelectorAll('.dummy:not(this)'));
    });
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="dummy"&gt;One&lt;/div&gt;
  &lt;div class="dummy"&gt;Two&lt;/div&gt;
  &lt;div class="dummy"&gt;Three&lt;/div&gt;
  &lt;div class="dummy"&gt;Four&lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>