jquery - 別のリンクをクリックすると、リンクからハイライトを削除します

Question

作業中のWebサイトにリンクのループがあります。各リンクには一意のIDがあり、これらのリンクの1つをクリックすると、リンクが太字で強調表示されます。別のリンクをクリックすると、強調表示されたリンクがクリックしたリンクに置き換えられます。

サンプルコード（jsFiddleの例を参照してください）：

$('body').on('click', '#link-1', function() {
    if($(this).hasClass('normal-text')) {
        $(this).removeClass('normal-text');
        $(this).addClass('bold-text');

    } else if($(this).hasClass('bold-text')) {
        $(this).removeClass('bold-text');
        $(this).addClass('normal-text');
    }
});

どうすればこれを達成できますか？

基本的なデモ：http：//jsfiddle.net/edgren/3VXVL/

私がどういう意味かを正確に確認するためのライブデモ：問題は解決されました

前もって感謝します。

Answer 1

これを試してくださいhttp://jsfiddle.net/3VXVL/4/

javascript：

$(document).ready(function() {
    $('body').on('click', '.link', function() {
        $('.bold-text').removeClass('bold-text');
        $(this).addClass('bold-text');
    });
});

html：

<a href="javascript:void(0)" id="link-1" class="link normal-text">Link 1</a> - 
<a href="javascript:void(0)" id="link-2" class="link normal-text">Link 2</a> - 
<a href="javascript:void(0)" id="link-3" class="link normal-text">Link 3</a>

Answer 2

クラスとのリンクを選択して、次のように削除できます。

$('.bold-text').removeClass('bold-text').addClass('normal-text');

Answer 3

各リンクにクラスを割り当てることができます。たとえば、「。changeableLink」としましょう。次に、次のようなことを行うことができます。

var allLinks = $('.changeableLink');
$('body').on('click', '.changeableLink',function() {
      allLinks.removeClass('bold-text');
      $(this).addClass('bold-text');
});