rails のeachメゾットで取得した変数を使う方法

Question

前提・実現したいこと

単語帳を作成中です。
そこで、eachメソッドを使い単語を表示させ、その後JavaScriptで単語の意味を表示させようとしています

発生している問題・エラーメッセージ

最初に表示させた単語と意味は、うまく動くが、その後二つ目以降は意味の方が表示できない

該当のソースコード

#index.erb
<div class="words-list">
  <ul class="word-list">
    <% @words.each do |word|%>
      <%if @flashcard.id == word.flashcard_id%>
        <li class="word-name">
          <span>単語</span>
          <%= word.name %>
        </li>

        <li class="word-meanig">
       
          <span>意味</span>
          <div class='word-meaning' id='answer'>
          <%= word.meaning %>
          </div>
           <input type="button" value="表示"
       onclick="document.getElementById('answer').style.visibility = 'visible';">
        
          </li>
      <% end %>
    <% end %>
  </ul>
</div>

#css
.word-meaning{
  visibility: hidden;
}

Answer 1

id="answer"という要素を複数作っていますが、idは1つのHTMLで重複させてはいけません。

Comments

[yamachi.0205]

```id```を重複させないためには、jsに渡す物を変数にする必要があると思いますが、どのような方法があるのでしょか。