title: Toggle menu active
body: <p>Hey I am doing a menu and I want that when I click the item enter in active position and then when another item is clicked it changes to the recently clicked to active and remove the state from the last one, this is what I am doing but is not working... I appreciate if someone can help me.</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div id="nav-pPal"&gt;
    &lt;ul class="nav-Ppal"&gt;
      &lt;li&gt;&lt;a class="btns-nav" id="0" href="#block-intro"&gt;01&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a class="btns-nav" id="1" href="#block-pq-zolfunza"&gt;02&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a class="btns-nav" id="2" href="#block-modulos-zolfunza"&gt;03&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a class="btns-nav" id="3" href="#block-seguridad"&gt;04&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a class="btns-nav" id="4" href="#block-desarrollo"&gt;05&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a class="btns-nav" id="5" href="#block-nuestra-ubic"&gt;06&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a class="btns-nav" id="6" href="#block-noticias"&gt;07&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a class="btns-nav" id="7" href="#block-preguntas"&gt;08&lt;/a&gt;&lt;/li&gt;
      &lt;li&gt;&lt;a class="btns-nav" id="8" href="#block-contacto"&gt;09&lt;/a&gt;&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>.nav-Ppal li a {
  width: 30px;
  height: 22px;
  padding-top:8px;
  text-align:center;
  display:block;
  text-decoration:none;
  color:#FFF;
  cursor:pointer;
  background-color: #000;
  color: #FFF;
  opacity: 1;
  -moz-opacity: 0.70;
  -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=70);
  cursor:pointer;
  font-family: 'lucida_sans_unicoderegular', Helvetica, Arial, sans-serif;
  font-size:11px;
  }
  .nav-Ppal li a:hover {
  background-color: #f7941e;
  color: #FFF;
  display:block;
  text-decoration:none;
  cursor:pointer;
  }
  
  .nav-Ppal-active{
  background: white;
  color: black;
  }
  </code></pre>
  
  <p>jQuery</p>
  
  <pre><code>$(".nav-Ppal li a").on("click", checkTarget);
  function checkTarget(){
      /*$(".nav-Ppal li a").not(this).removeClass(".nav-Ppal_active");*/
      $(".nav-Ppal li a").addClass("nav-Ppal-active");
      console.log("click");
  }
  </code></pre>