cambiar clase css con jquery

[viringas]

hola a todos,

tengo la siguiente lista:

Código HTML:

<ul class="lista_horizontal paginacion">
<li class="lista_horizontal"><a href="cargaPublicaciones.php?anho=<?php echo($arrayAnhos[$c]);?>" class="cargar colorLi" > <?php echo($arrayAnhos[$c]);?> </a></li>
<li class="lista_horizontal"><a href="cargaPublicaciones.php?anho=<?php echo($arrayAnhos[$c]);?>" class="cargar colorLi" > <?php echo($arrayAnhos[$c]);?> </a></li>
<li class="lista_horizontal"><a href="cargaPublicaciones.php?anho=<?php echo($arrayAnhos[$c]);?>" class="cargar colorLi" > <?php echo($arrayAnhos[$c]);?> </a></li>
 
</ul>
 

y con este codigo javascript accedo a las diferentes paginas:

Código Javascript:

<script>
$("a.cargar").each(function(){
    var href = $(this).attr("href");
    $(this).click(function(){
        $(this).removeClass("colorLi");
        $(this).addClass("actual");
        $("#paginacion_publicacion").fadeOut(0);
        $("#paginacion_publicacion").fadeOut().load(href).fadeIn('slow');
    });
    $(this).attr({href:"#!"});
});
 
</script>
 

cada elemento de la lista tiene una clase inicial que es color Li, yo lo que quiero es que una vez pulse en un elemento de la lista, este cambie a otra clase que tengo llamada actual.

mi problema radica en q con los metodos de jquery addclass() y removeclass() lo aplica a todos los elementos de la lista y no en el que hago click en cada momento, es decir me cambia la clase a todos los elementos. hasta donde yo se de jquery creo q tal como tengo el codigo deberia de funcionar pero no es asi

si alguien tiene alguna idea mejor que la mia o sabe donde esta mi fallo xq yo llevo un largo tiempo viendo el codigo y no encuentro el problema


gracias

[sander]

Hola.

Segun lo que te entendi creo que deberias hacerlo asi:

Código Javascript:

<script type="text/javascript">
 
    $( 'a.cargar' ).click(function(){
 
        $( 'a.cargar' ).each(function(){
            $( this ).removeClass( 'actual' );
            $( this ).addClass( 'colorLi' );
        });
 
        $( this ).removeClass( 'colorLi' );
        $( this ).addClass( 'actual' );
 
    });
 
</script>
 

Saludos.

[viringas]

veras me explike mal, tengo una lista de elementos al cual le doy un estilo en la propia lista tal q asi:

Código HTML:

<li class="lista_horizontal"><a href="cargaPublicaciones.php?anho=<?php echo($arrayAnhos[$c]);?>" class="cargar" style="color: rgb(104, 186, 100); 
    background-color: rgb(227, 242, 225); border: rgb(227, 242, 225);" > <?php echo($arrayAnhos[$c]);?> </a></li>
 

y lo q hago con javascript es q cuando haga click cambie a otro estilo tal q asi :

Código Javascript:

$("a.cargar").each(function(){
    var href = $(this).attr("href");
    $(this).click(function(){
        
        $(this).css({'color':'black','background-color':'rgb(202, 230, 198)','border':'1px solid rgb(190, 248, 184)'}); 
        $("#paginacion_publicacion").fadeOut(0);
        $("#paginacion_publicacion").fadeOut().load(href).fadeIn('slow');
        
    });
    $(this).attr({href:"#!"});
    
});
$(this).css({'color':'rgb(104, 186, 100)','background-color':'rgb(227, 242, 225)','border':'rgb(227, 242, 225)'}); 
// es esta linea es donde le digo q vuelva a su color original pero creo q estoy entendiendo mal la logica y no lo hace como yo kiero
 

como mis conocimientos son limitados con respecto a jquery y javascript pues no se como puedo hacerlo,