passing php variable into javascript in a foreach or while loop

this is my java javascript code i am trying to pass the id of each comment as a reply_comment_id but i keep getting the comment_id of the last post inserted but if in the when i check my source code in chrome or firefox it prints the value of my input value reply_comment_id but when i try to print it in javascript it keeps printing out the the id of the last comment inserted

$(document).ready(function(){
   $(".send-btn").click(function(){
     var reply_comment = $('#reply_comment').val();
     var reply_comment_id = $("#reply_comment_id").val();         
     var replied_by = $("#replied_by").val();
     $('.comment-text').text(reply_comment);
     alert(reply_comment_id);

      $.ajax({// ajax to post comments into the php page
     url: "comment.php",
     type: "post",
    cache: "false",
    data: {
      reply_comment_id: reply_comment_id,
     reply_comment:reply_comment,
    replied_by:replied_by,   
    },
    success: function(data) {
        $('#reply_comment').val("");
        console.log(data);
        alert("success");
    },
    error: function(){
        alert("failure");
         }
      });
    });
});

this is my php code here i have my comment_id value as a hidden input like i said above in view source code it prints each comment id but i cannot pass it to the javascript code each code

     <?php  foreach($comments as $comment): ?>// for each
      <div class="comment-body">

      <div class="comment-text"><p style="color:black;"><?php echo $comment-  >comment;?></p></div>
      <input id="reply_comment_id"type="hidden"value="<?php echo $comment->comment_id;?>">
<?php endforeach;?>  // end of foreach