Run ยป
<!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"> </script> <style> table, th, td { border: 1px solid black; border-collapse: collapse; } </style> <script> $(document).ready(function(){ $("button").click(function(){ var trclass = $(this).closest('tr').attr('class'); // table row ID $("#message").text("Closest tr id is: " +trclass); }); }); </script> </head> <body> <h3>Get closest tr class in jQuery</h3> <p>Click on the show class to get the result.</p> <table style="width:100%" id="myTable"> <tr> <th>Sl No</th> <th>Stock</th> <th>Quantity</th> <th>Price</th> <th>Action</th> </tr> <tr id="1" class="1"> <td>1</td> <td><input type="text" class="stock" ></td> <td><input type="text" class="quantity"></td> <td><input type="text" class="price"></td> <td><button type="button">Show Class</button></td> </tr> <tr id="2" class="2"> <td>2</td> <td><input type="text" class="stock"></td> <td><input type="text" class="quantity"></td> <td><input type="text" class="price"></td> <td><button type="button">Show Class</button></td> </tr> <tr id="3" class="3"> <td>3</td> <td><input type="text" class="stock"></td> <td><input type="text" class="quantity"></td> <td><input type="text" class="price"></td> <td><button type="button">Show Class</button></td> </tr> </table> <h3 id="message"></h3> </body> </html>