JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://jqueryui.com/ui/jquery.effects.core.js"></script>
<div>
    <input id="selectedId" type="text" />
</div>

<table cellspacing="1" class="tablesorter" id="nameList">
    <thead>
        <tr>
            <th class="header">Name</th>
            
            <th class="header">Id</th>
            
            <th class="header">Gender</th>
            
            <th>Select</th>
        </tr>
    </thead>
    
    <tbody>
        <tr>
            <td>Akom Smith</td>
            
            <td class="id">0001</td>
            
            <td>M</td>
            
            <td><a href="#" class="click-to-select">Select</a></td>
        </tr>
        
        <tr>
            <td>Amara Sahara</td>
            
            <td class="id">0002</td>
            
            <td>F</td>
            
            <td><a href="#" class="click-to-select">Select</a></td>
        </tr>
        
        <tr>
            <td>John Lache</td>
            
            <td class="id">0003</td>
            
            <td>M</td>
            
            <td><a href="#" class="click-to-select">Select</a></td>
        </tr>
    </tbody>
</table>

CSS

#divmsg6 p.red {
    display: none;
    color: red;
}

JavaScript

$('.click-to-select').click(function() {
    var id = $(this).closest('tr').find('td.id').text();
    $('#selectedId').val(id)
});