Question

I found this jQuery code on a forum: http://jsfiddle.net/nZLpk/8/
However, if I change the code to this http://jsfiddle.net/c5LTj/ (modifying $(this).css({'font-weight': 'bold', 'border-left': '5px solid #555554'}); the border will stay on the link even if that is not the selected one… Please help. Thanks!

Answer 1

You have to reset border-left on all elements with class atag the same way you are resetting their font-weight:

$(document).ready(function(){
    $('.atags').click(function(){
        $('.atags').css({"font-weight":"300", 'border-left': '0'});
        $(this).css({'font-weight': 'bold', 'border-left': '5px solid #555554'});
    });
});

http://jsfiddle.net/c5LTj/1/

If you just want to change the color, as you said the comment below:

$('.atags').css({"font-weight":"300", 'border-left-color': '#555554'});
$(this).css({'font-weight': 'bold', 'border-left-color': '#eee'});

You could also improve your code a lot if you remove showonlyone and the inline href="javascript:showonlyone instances, and do the work of showonlyone in the same place where you’re changing the appearance of the links.