addClass et removeClass

Bonjour à tous,
j'ai un petit souci avec ce script. Lorsque je clique sur un lien (summary > h2 > a) la class active n'est pas à ce lien.
Pouvez-vous m'aider merci.

<div class="summary">
<h2><a id="a1" rel="content1" href="#" title="Actualités et évènements">Actualités/Evènements</a> <a id="a2" rel="content2" href="#" title="Les spécialités">Spécialités</a> <a id="a3" rel="content3" href="#" title="L'ambiance du restaurant">Ambiance</a> <a id="a4" rel="content4" href="#" title="Notre situation géographique">Où sommes-nous ?</a></h2>
</div>
<div id="content1" class="content"></div>
<div id="content2" class="content"></div>
<div id="content3" class="content"></div>
<div id="content4" class="content"></div>
<script type="text/javascript">
jQuery(function(){
    // widget
    $(".content").hide();
    $("#content1").show();
    $(".summary a:first").addClass("active");
    $(".summary a").click(function(){
        var id = $(this).attr("rel"); // récupère l'id du lien
        $(".summary a").removeClass("active"); // on enlève la class active aux liens
        $(".content").hide(); // on cache tous les div
        $("#"+id).fadeIn(500); // on affiche le div correspondant à l'id
        var idA = id.replace('content','a');
        $("#"+idA).addClass("active"); // on applique la class active au lien en cours
        return false;
    });
});
</script>
..
h2 a.active {
    color: #6D3A77;
}