Как получить id определенного объекта из таблицы в html страницы на ajax

Пишу Crud систему на spring boot есть таблица в html странице и со списком учеников когда нажимаю на кнопку удалить получаю на ajax ид всех элементов как сделать так, чтобы я получил ид шку определенного объекта из таблицы

<table class="table">
        <thead>
        <tr>
            <th scope="col">Номер : </th>
            <th scope="col">Имя :</th>
            <th scope="col">Фамилия :</th>
            <th scope="col">Действие :</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="student : ${students}">
            <td th:text="${student.id}" class="studentId"></td>
            <td th:text="${student.name}"></td>
            <td th:text="${student.surname}"></td>
            <td><a  class="btn btn-danger delete">Delete</a></td>
        </tr>
        </tbody>
    </table>

 $(".delete").click(function (event) {
    var id = $(".studentId").text();
    //stop submit the form, we will post it manually.
    alert("id" + id);
    event.preventDefault();
    $("#btn-search").prop("disabled", true);

    $.ajax({
        type: "POST",
        contentType: "application/json",
        url: "/api/delete",
        data: JSON.stringify({ id: id}),
        dataType: 'json',
        cache: false,
        timeout: 600000,
        success: function (data) {
            location.reload();
        },
        error: function (e) {

            var json = "<h4>Ajax Response</h4><pre>"
                + e.responseText + "</pre>";
            $('#feedback').html(json);

            console.log("ERROR : ", e);
            $("#btn-search").prop("disabled", false);

        }
    });

});