Добавить класс к объекту с щелчком li

Question

Как добавить class="active" к нажатому объекту li? В настоящее время он не работает, когда я нажимаю ссылку. Ниже вы найдете мой код.

<div class="nav-collapse collapse pull-right"> 
        <ul id="menu" class="nav"> 
         <li><a href="Default.aspx">Anasayfa</a></li> 
         <li><a href="About.aspx">Hakkımızda</a></li> 
         <li class="dropdown"> 
          <a href="#" class="dropdown-toggle " data-toggle="dropdown">Hizmetlerimiz <i class="icon-angle-down"></i></a> 
          <ul class="dropdown-menu"> 
           <li><a href="WebDesign.aspx">Web Tasarım</a></li> 
           <li><a href="GraphicDesign.aspx">Grafik Tasarım</a></li> 
           <li><a href="MatbaaHizmetleri.aspx">Matbaa Hizmetleri</a></li> 
           <li><a href="PromosyonHizmetleri.aspx">Promosyon Hizmetleri</a></li> 
           <li><a href="AcikHavaReklam.aspx">Açık Hava Reklamcılığı</a></li> 
           <li><a href="StandUygulamaları.aspx">Fuar Stand Uygulamaları</a></li> 
          </ul> 
         </li> 
         <li><a href="References.aspx">Referanslar</a></li> 

         <li><a href="Blog.aspx">Blog</a></li> 
         <li><a href="Contact.aspx">İletişim</a></li>       
        </ul> 
       </div> 


header.navbar .nav > li.active > a, header.navbar .nav > li.active > a:hover { 
      background: transparent; 
      color: #2dcc70; 
      -webkit-box-shadow: none; 
      -moz-box-shadow: none; 
      box-shadow: none; 
     } 

<script type="text/javascript"> 
     $(document).ready(function() { 
      $('#menu > li > a').click(function() { 
       $('#menu > li > a').removeClass("active"); 
       $(this).addClass("active"); 
      }); 
     }); 
    </script> 

Answer 1

попробовать это:

$('#menu li a').click(function() { 
      $('#menu li a').removeClass("active"); 
      $(this).addClass("active"); 
     }); 

Answer 2

Прочитайте приведенный ниже код, надеюсь, что это помогает!

var selector = '.nav li'; 
 

 
$(selector).on('click', function(){ 
 
    $(selector).removeClass('active'); 
 
    $(this).addClass('active'); 
 
});

li.active { 
 
    color: #323643; 
 
    text-shadow: 0 0 5px black; 
 
    font-size: 20px; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<ul class="nav"> 
 
    <li>One</li> 
 
    <li>Two</li> 
 
    <li>Three</li> 
 
    <li>Four</li> 
 
</ul>