JavaScriptを使用して2つの異なるdivを表示および非表示にするにはどうすればよいですか？

Question

私はこのサイトでいくつかのjavascriptを使って、2つの異なるdivを表示して隠すようにしました。基本的に、誰かが「ボタン」の着信やクリックをクリックすると、下にAAA divが表示されます。誰かが "bボタン"をクリックすると、AAA divを非表示にして、BBB divを下に表示します。

私はブートストラップの崩壊を使用することを考えましたが、アニメーションが必要ではありませんでした。

私は間違っていますか？あなたはjQueryのは、あなただけのクリックハンドラとshow（）非表示（）関数を使用することができますロードされていると仮定すると、

http://matthewtbrown.com/test/index.html

// set content on click 
$('.button').click(function(e) { 
e.preventDefault(); 
setContent($(this)); 
}); 

// set content on load 
$('.button.active').length && setContent($('.button.active')); 

function setContent($el) { 
$('.button').removeClass('active'); 
$('.container').hide(); 

$el.addClass('active'); 
$($el.data('rel')).show(); 
} 

<div class="flr-wrap"> 
<ul> 
    <li><a class="timebutton active" data-rel="#content-a" href="#">a button</a></li> 
    <li><a class="timebutton" data-rel="#content-b" href="#">b button</a></li> 
</ul> 

<div class="flr-inner"> 
    <div class="timecontainer" id="content-a"> 
     AAA 
    </div> 
    <div class="timecontainer" id="content-b"> 
     BBB 
    </div> 
</div> 

Answer 1

。 ？何が私が間違っているの

$(".a-button").click(() => { 
    $("#foo").hide() 
    $("#bar").show() 
}); 

$(".b-button").click(() => { 
    $("#bar").hide() 
    $("#foo").show() 
});