title: .not method fails?
body: <p>I have written two jQuery functions, the simplified version of which run thus:</p>
  
  <pre><code>$('button.class').not('.selected').on('click', function() {
      console.log('not selected');
      console.log($(this));
      $(this).addClass('selected');
  }
  
  $('button.class.selected').on('click', function() {
       console.log('selected');
       console.log($(this));
       $(this).removeClass('selected');
  }
  </code></pre>
  
  <p>Clicking on the button <strong>always</strong> logs the following in the console:</p>
  
  <pre><code>not selected
  [&lt;button class="someClass1 someClass2 selected"&gt;Text&lt;/button&gt;]
  </code></pre>
  
  <p>The Web Inspector shows this before clicking on the button:</p>
  
  <pre><code>&lt;button class="someClass1 someClass2"&gt;Text&lt;/button&gt;
  </code></pre>
  
  <p>and this after clicking on it:</p>
  
  <pre><code>&lt;button class="someClass1 someClass2 selected"&gt;Text&lt;/button&gt;
  </code></pre>
  
  <p>Clicking on it again changes nothing.</p>
  
  <p>Switching <code>addClass()</code> to <code>toggleClass()</code> succeeds in toggling <code>'selected'</code> on and off, but still always logs <code>not selected</code>, which suggests something is going on with my selectors. Why is the first function always being called even when <code>'selected'</code> is clearly one of the classes associated with the <code>button</code> element?</p>
  
  <p>I noticed in testing some solutions that hard-coding <code>'selected'</code> as a class of <code>button</code> results in the opposite problem: only second of the functions is ever called, even though <code>toggleClass()</code> works as intended. Do classes added via jQuery not "count" as classes?</p>