Hola comunidad, estoy eniendo una duda que m tien a mal traer , tngo un documento php donde tengo una <ul>
Código HTML:
<ul id="menu-prod">
<li><a href="javascript:switchSec(1)">Generadores Inverter</a></li>
<li ><a href="javascript:switchSec(6)">Generadores portátiles</a> </li>
<li><a href="javascript:switchSec(16)">Grupos electrógenos</a></li>
<li><a href="javascript:switchSec(25)">Motobombas</a></li>
<li><a href="javascript:switchSec(11)">Motores estacionarios</a></li>
<li><a href="javascript:switchSec(12)">Motosoldadoras</a></li>
<li><a href="javascript:switchSec(7)">Jardinería</a></li>
</ul>
</div>
<div id="wrapper-productos">
<div class="product-content">
<h1>Generadores inverter</h1>
<ul class="int-menu">
<li class="int-active"><a href="javascript:switchSec(1)">IG1000</a></li>
<li><a href="javascript:switchSec(2)">IG2000</a></li>
<li><a href="javascript:switchSec(3)">IG2600</a></li>
<li><a href="javascript:switchSec(4)">IG3000X </a></li>
<li><a href="javascript:switchSec(5)">IG6000h</a></li>
</ul>
y documentos php que son llamados externamente por lo que no salgo del documento php que tengo sa ul, el problema que estoy teniendo es que necesito que al hacer click en cada elemento de esa ul me tome una clase de css y se mantenga como que esa seccion esta activa por lo que tengo esta funcion jquery:
Código HTML:
$(document).ready
$("ul#menu-prod li a").click(function(){
$(this).addClass("activeproduc");
$("ul#menu-prod li a").click(function(){
$(this).removeClass("activeproduc");
});
});
el tema es que cuando hago click en una li me toma la clase activeproduc pero cuando voy a hacer click en otra li de esa ul la clase queda permanentemente en la li que al principio hice click que estare haciendo mal ?