要素自体がクリックされたとき、または他のボタンがクリックされたときに要素のプロパティ値をリセットするにはどうすればよいですか?

Question

クリックをリッスンする単純な JavaScript があり、クリックされると 4 つのことが起こります。

1. 「フォームを開く」クラスがボタンに追加されました
2. 「aria-expanded」属性は「true」に設定されます
3. 以前に非表示にした div を表示します。
4. ボタンの「後」テキストは「情報を閉じる」に変わります(これは、ボタンに新しいクラス「form-opened」が含まれているかどうかに基づいてCSSによって制御されます)。

別のボタンをクリックすると、最初にクリックしたボタンと逆のことが起こり、追加されたクラスが削除され、「aria-expanded」属性が「false」にリセットされ、div が再び非表示になります (CSS 用に再設定されます)。 「後」のテキストは「続きを読む」に戻ります。

ただし、同じボタンが 2 回目にクリックされると、追加されたクラスは期待どおりに削除され、div は再び非表示になりますが、「aria-expanded」属性は「false」にリセットされません。誰かがその理由を説明し、私が何をすべきかを教えてもらえますか？ (jQuery はありません、ありがとう)。

リーリー リーリー リーリー

同様のクエリをいくつか見たことがありますが、まったく同じではなかったり、非常に古いものであったり、jQuery を使用していたり​​します。

Answer 1

ボタンをクリックすると、他のすべてのボタンの aria-expanded プロパティのみが false に設定されます。現在のボタンの状態を切り替える必要もあります:

リーリー