title: .not Selector is acting like a toggle?
body: <h2><code>.not</code> does not mean &quot;not&quot;?</h2>
  <p>First off, I know there are a lot of threads on the <code>.not</code> selector and I've tried several stack overflow solutions, but I haven't had any success so far.</p>
  <p>In my current project, I'm adding and removing content visibility using jQuery. My issue though, when I click on a list-item twice, it toggles between being visible and hidden. I thought the <code>.not</code> selector would prevent this, but <a href="https://stackoverflow.com/questions/5533675/jquery-not-not-working">another thread</a> left me with the impression that the <code>.not</code> selector is not necessarily what I think it is. I'm currently using</p>
  <p><code>$('.rokSprocket &gt; div._' + num)</code></p>
  <p>to make the content visible, and</p>
  <p><code>$('.rokSprocket &gt; div').not('._' + num)</code></p>
  <p>with the intent of making all other content inside my container invisible. If the <code>.not</code> doesn't necessarily mean &quot;not this element/class/etc.&quot;, is there a  selector I can substitute in it's place?</p>
  <p><strong>jQuery:</strong></p>
  <pre><code>        &lt;script&gt;
              $(document).ready(function() {
                  $(&quot;.nav-tabs &gt; li&quot;).click(function () {
                      var $this = $(this),
                          classes = $this.attr('class').toString().split(/s+/),
                          num = 0;
                  
                      $.each(classes, function (i, v) {
                          if (v.match(/_\d+/gim).length) num = v.split('_')[1];
                      });
                      
                      $('.rokSprocket &gt; div._' + num)
                          .removeClass('hidden')
                          .addClass('visible');
                  
                      $('.rokSprocket &gt; div').not('._' + num)
                          .removeClass('visible')
                          .addClass('hidden');
                      
                      $('.nav-tabs &gt; li._' + num)
                          .addClass('active');
                  
                      $('.nav-tabs &gt; li').not('._' + num)
                          .removeClass('active');
                  });
              });
              &lt;/script&gt;
  </code></pre>
  <p><strong>HTML:</strong></p>
  <pre><code>&lt;ul class=&quot;nav-tabs&quot;&gt;
      &lt;li class=&quot;_1 active&quot;&gt;Painting&lt;/li&gt;
      &lt;li class=&quot;_2&quot;&gt;Tile Floors&lt;/li&gt;
      &lt;!-- Etc --&gt;
      &lt;!-- Etc --&gt;
      &lt;!-- Etc --&gt;
  &lt;/ul&gt;
  
  &lt;div class=&quot;rocSprocket&quot;&gt;
      &lt;div class=&quot;_1 visible painting&quot;&gt;
          &lt;p&gt;Content&lt;/p&gt;
      &lt;/div&gt;
  
      &lt;div class=&quot;_2 hidden tileFloors&quot;&gt;
          &lt;p&gt;Different Content&lt;/p&gt;
      &lt;/div&gt;
  
      &lt;!-- Etc --&gt;
      &lt;!-- Etc --&gt;
      &lt;!-- Etc --&gt;
  &lt;/div&gt;
  </code></pre>
  <p><strong>jsFiddle:</strong>
  <a href="http://jsfiddle.net/o39zgp04/" rel="nofollow noreferrer">http://jsfiddle.net/o39zgp04/</a></p>