javascript - 別の DIV コンテンツの可視性に基づいて DIV コンテンツを表示する方法

Question

ページに次の DIV 要素が一緒に表示されます。

<div><a href="javascript:;" id="awesome-button" style="visibility:hidden">This Link Shows Up First</a></div>

<div style="display:none; id:showUpAfterAwesomeButtonIsClicked;"><a href="javascript:;" onclick="someFunction();">This is the value that should show up after the link above is clicked.</a></div>

ご覧のとおり、This Link Shows Up Firstテキストはページの読み込み時に最初に表示されます。ユーザーがThis Link Shows Up Firstテキストをクリックしたかどうかを判断する次の JavaScript があります。目標は、This is the value that should show up after the link above is clickeddiv が非表示の場合に表示することawesome-buttonです。

custom.valueAwesome = function() {
var awesomeButton = document.getElementById('awesome-button');
awesomeButton.style.visibility = 'hidden';
document.getElementById("showUpAfterAwesomeButtonIsClicked").style.display = '';
gadash.executeCommandQueue();
};

このスクリプトをテストshowUpAfterAwesomeButtonIsClickedしたところ、ユーザーがリンクをクリックすると、リンクの状態が非表示に変更されました。これにより、更新する必要がある接続は次の行に関係していると思われます。

document.getElementById("showUpAfterAwesomeButtonIsClicked").style.display = '';

このラインのいくつかのバリエーションを試しました。この結果を達成するためのより良い方法はありますか? ありがとう。