Modal always getting first Id - asp.net

Question

I have a basic feedback section, where people can reply to people's feedback. When I click the Reply button, it is supposed to open modal with text to fill and have the FeedbackParentId set to the feedback that has been clicked. However, it is always set to the first feedback.
This is the loop where I simply show all the feedback on the page.
#foreach (var comment in Model.Feedback.OrderByDescending(x => x.CreatedOn))
{
<partial name="_CommentSectionPartial" model="comment" />
}
This is the comment partial itself. Why would the modal get the first ID always?
#model FeedbackViewModel
<div class="comment-list" id="#Model.Id">
<div class="single-comment justify-content-between d-flex">
<div class="user justify-content-between d-flex">
<div class="thumb">
<img src="~/images/blog/c3.jpg" alt="">
</div>
<div class="desc">
<h5>
#Model.Name
</h5>
<p class="date">#Model.CreatedOn.Value.ToLongDateString()</p>
<p class="comment">
#Model.Comment
</p>
</div>
</div>
<div class="reply-btn">
<div class="modal fade" id="replyModal" tabindex="-1" role="dialog" aria-labelledby="replyModalLabel" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title" id="replyModalLabel">Submit Feedback for #Model.Name</h5>
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<form id="send-reply-form" asp-action="AddReply" asp-controller="Business" asp-area="Business">
<input type="hidden" name="feedbackparentId" value="#Model.Id" />
<input type="hidden" name="businessid" value="#Model.Business.Id" />
#Html.AntiForgeryToken()
<div class="form-group form-inline">
<div class="form-group col-lg-6 col-md-6 name">
<input type="text" name="authorName" class="form-control col-form-label" id="name" placeholder="Enter Name" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter Name'">
</div>
<div class="form-group col-lg-6 col-md-6 email">
<input type="email" name="email" class="form-control" id="email" placeholder="Enter email address" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Enter email address'">
</div>
</div>
<div class="form-group">
<textarea class="form-control mb-10" rows="5" name="comment" placeholder="Message" onfocus="this.placeholder = ''" onblur="this.placeholder = 'Message'"
required=""></textarea>
</div>
<button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
<button type="submit" class="btn btn-primary">Send Feedback</button>
</form>
</div>
</div>
</div>
</div>
<button id="reply-button" type="button" class="btn btn-primary float-right" data-toggle="modal" data-target="#replyModal">Reply</button>
</div>
</div>
</div>
I tried setting the value through JS like that, does not work.
$(document).ready(function () {
$("#send-reply-form").click(function () {
$("#feedbackparentId").val($(this).data('id'));
});
});

Answer 1

I've fixed it with that piece of code:
$(document).on("click", "#reply-button", function () {
var feedbackId = $(this).data('id');
$(".modal-body #feedbackparentId").val(feedbackId);
console.log(feedbackId);
});