JSFiddle - React, Tailwind, and code Playground

HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<div style="height: 50px; width: 50px; background: black"></div>

<table id="pets" class="table-border" style="width: 800px; margin-top: 1em; border-collapse: collapse">
    <tr>
        <td>Name</td>
        <td>Breed</td>
        <td class="highlightTop">Age</td>
    </tr>
    <tr>
        <td><input type="text" name="petName" style="width: 100%"/></td>
        <td>...</td>
        <td class="highlight"><input type="numbers" name="age" style="width: 100%"/></td>
</table>

JavaScript

alert($('#pets .highlightTop').position().top);