评论部分 - 重播按钮 - 无法正常工作 - JavaScript

Question

我尝试创建一个评论部分，我想创建一个“回复按钮”，当我点击它时会向下切换，我创建了这个框部分，但问题是，我有多个这样的框，并且每次我点击“回复按钮”时，它只会在第一个框上切换我，我希望每个框卡都有自己的“回复按钮”：

enter image description here

这是我的 HTML：

<div class="comments-list" id="comments-list">
      <script id="comment-template" type="text/x-template">
      <div dir="rtl" class="card" style="width: 50rem;"> 
        <div dir="rtl" class="card-body">
      <div class="comment-info">
        <!-- <div class="row"> -->
              <div class="card-title">{{name}}</div>
              <div class="card-subtitle mb-2 text-muted">{{data}}</div>
         <!-- </div> -->
         <!-- <div class="row"> -->
          <div class="card-text">{{comment}}</div>
          <a class="card-link" role="button" data-toggle="collapse" href="#replyCommentThree" aria-expanded="false" aria-controls="collapseExample">replay</a>
          <div class="collapse" id="replyCommentThree">
            <form>
              <div class="form-group">
                <label for="comment">cooment</label>
                <textarea name="comment" class="form-control" rows="1"></textarea>
              </div>
              <button type="submit" class="btn-comment">send</button>
            </form>
          </div>
        <!-- </div> -->
      </div>
     </div>
    </div>
    </script>
      </div>

这里是我的 javascript：

 var commentsList = document.getElementById('comments-list'),
             commentTemplate = document.getElementById('comment-template');
             var newCommentHtml = commentTemplate.innerHTML.replace('{{name}}',username);
             newCommentHtml = newCommentHtml.replace('{{data}}',date_comm);
             newCommentHtml = newCommentHtml.replace('{{comment}}',questionone);
               var newCommentNode = document.createElement('div');
               newCommentNode.classList.add('comment');
               newCommentNode.innerHTML = newCommentHtml;
               commentsList.appendChild(newCommentNode);
            
               db.collection('commentsinfo').add(
                {
                    
                    name: username,
                    data: date_comm,
                    comment:questionone 
                    
                }

            )