javascript - JavaScript、別のタブを開いたときにタブを閉じる

Question

私はここ数時間答えを探していたので、ここに来て少し助けを求めることに頼らなければなりませんでした.

問題: クリックしたタブに応じてマップまたはリストを開くいくつかの href タグがあります。私の問題は、マップをデフォルトで開くように設定する必要があり、リスト タブをクリックすると、地図をクリックしてリストを閉じたり開いたりします (つまり、基本的に一方をクリックするともう一方が閉じ、その逆も同様です)。

これが私のコードです

HTML:

 <div class="clearfix"></div>
<a class="sortby">
    SORT BY
</a>
<a class="sortby_town" href="javascript:showDiv()">
    MAP
</a>
<a class="sortby_category" href="javascript:showListings()">
    LISTINGS
</a>

<div id="townmap" style="display: none; margin-top: 60px;">
{loadposition sawbridgeworth}
</div>

<div id="townlistings" style="display: none; margin-top: 60px;">
{component url='index.php?Itemid=132&option=com_mtree&task=search&searchword=Sawbridgeworth&cat_id=0'}
</div>

JavaScript:

function showDiv() {
document.getElementById('townmap').style.display = "block";
}

function showListings() {
document.getElementById('townlistings').style.display = "block";
}

どんな助けでも大歓迎です！前もって感謝します！