How to mark links, handled with javascript as visited?

Question

I have a navigation like this:

<div id="melement1" class="mlink" data-slink="kultur">
    <a href="#kultur">Kultur|Bildung</a>
</div>

This works fine, and with this link, I open another subnavigation:

case "kultur": 
    document.getElementById('navi_kultur').style.visibility = 'visible';
    break;

The subnavigation looks like this:

<div id="kultur1" class="link" data-subsite="kultur/hoehenrausch">
    <a href="#kultur?hoehenrausch">Linz 09 - Höhenrausch, Linz</a>
</div>

and I handle it via Ajax:

$('.link').click(function(){
    var subsite = $(this).data('subsite');
    $('#showProject').load('php/subsite.php?page='+subsite);

So my question is:

How can I set the state of the links of my subnavigation to active/visited?

Answer 1

Just add the visited class:

<style type="text/css">
    a { color: red; }
    a.visited { color: blue; }
</style>
<script type="text/javascript">
    $(".link a").click(function(){
        $(this).addClass("visited");
    });
</script>

See this jsFiddle for a demonstration.