Question: I call jquery function onclick at links. For example:

```
<a class="active" href="#" onClick="Animate2id('#box1');" >Content 1</a>
<a href="#" onClick="Animate2id('#box2');" >Content 2</a>
<a href="#" onClick="Animate2id('#box3');" >Content 3</a>

```

As you can see, first link has by default class 'active'. I want to remove the class from first link and add to the link which is clicked.
For that purpose, I'm trying to add following line inside the Animate2id function:

```
$('.active').removeClass('active');
$(this).addClass('active');

```

It just removes the class from the link.
But this does not add the class to any of the link. How I can fix that?

**Edit:**
Here is complete jQuery function:

```
function Animate2id(id){ 
    var animSpeed=2000; 
    var $container=$("#container"); 
    if(ease){ 
        var easeType=ease;
    } else {
        var easeType="easeOutQuart"; 
    }

    $container.stop().animate({"left": -($(id).position().left)}, animSpeed, easeType);
}

```

Answer: 
If you have the `<a>` tags in a parent element with an id, you can do this:

```
$('#parent_element_of_links a').click(function(e) {
    e.preventDefault();
    $('#parent_element_of_links a').removeClass('active');
    $(this).addClass('active');
});

```

Working example: <http://jsfiddle.net/fDZ97/>

You could also just put the code above in your `Animate2id()` function that you have:

```
function Animate2id(id, ease) {
    var animSpeed = 2000;
    var $container = $("#container");
    if (ease) {
        var easeType = ease;
    } else {
        var easeType = "easeOutQuart";
    }

    $container.stop().animate({
        "left": -($(id).position().left)
    }, animSpeed, easeType);

    // remove "active" class from all links, add it to this one
    $('#parent_element_of_links a').removeClass('active');
    $(this).addClass('active');
}​

```

---

Update
------

The `this` keyword wasn't working because it was referring to the window rather than the link. So I added an extra parameter in the function and it works perfectly now, just remember to add `this` in the onclick (right before you define the `ease` variable):

```
function Animate2id(id, t, ease) {
    var animSpeed = 2000;
    var $container = $("#container");
    if (ease) {
        var easeType = ease;
    } else {
        var easeType = "easeOutQuart";
    }

    $container.stop().animate({
        "left": $(id).position().left
    }, animSpeed, easeType);

    // remove "active" class from all links, add it to this one
    $('#links a').removeClass('active');
    $(t).addClass('active');
}​

```

Working jsFiddle Example: <http://jsfiddle.net/Uqqmy/>
Ok thanks for pasting the code, try this:

First wrap the group of anchor tags in a div, so you can seperate them out from the other anchors on your page, and they will be grouped:

So:

```
<div id="anchorGroup">
<a class="active" href="#">Content 1</a>
<a href="#">Content 2</a>
<a href="#">Content 3</a>
</div>

```

Then try this JQuery code:

```
    $("#anchorGroup a").click(function() {
    $("#anchorGroup a").removeClass('active');
    $(this).addClass('active');

});

```