最近Webページを作成していて困ったのですが、ページ内のシーン図に複数の商品が表示されており、商品をクリックするたびにその商品に対応する情報一覧がシーン図の下に表示されてしまいます。

現在発生している問題は、ページを更新して初めて商品をクリックすると情報一覧が正常に表示されるのですが、ページを更新せずに再度同じ商品をクリックすると、その情報リストが蓄積されます。

すみません、ページを更新せずに製品を複数回クリックして、その情報リストを 1 回だけ表示するにはどうすればよいですか?

以下は私のスクリーンショットとコードです:

このボタンを初めてクリックすると、通常どおり製品リストが表示されます:

ページを更新せずに、このボタンを 2 回続けてクリックすると、その製品リストが元のベースで累積的に表示されます:

私のデータ構造は次のようなものです:

問題は、 が繰り返し表示され続ける contentList 配列です。
私の JS は次のように書かれています:

元のコードをどのように変更すべきかについて、マスターの方からアドバイスをいただけませんか? ありがとう!