JS, HTML: Как получить данные из формы, если их несколько и они имеют одинаковый класс

На странице есть несколько форм:

<form class="delete_comment">
    <input type="hidden" value="1" name="comment_id">
    <button type="submit" name="delete">Delete comment</button>
</form>

<form class="delete_comment">
    <input type="hidden" value="2" name="comment_id">
    <button type="submit" name="delete">Delete comment</button>
</form>

<form class="delete_comment">
    <input type="hidden" value="3" name="comment_id">
    <button type="submit" name="delete">Delete comment</button>
</form>

Цель:
При нажатии на кнопку в консоль должно вывести значение инпута comment_id, то есть id комментария, который нужно будет удалить (php, ajax уже реализован).
Вопрос:
Как сделать так, чтобы при нажатии на кнопку, выводилось значение именно из той формы, которой принадлежит эта кнопка?


Ответы (1 шт):

Автор решения: Igor
$(".delete_comment button").click(function(){
  console.log($(this).closest(".delete_comment").find("input").val());
});
→ Ссылка