JSFiddle - React, Tailwind, and code Playground

HTML

<table id="table_id" class="sortable">
        <thead>
            <tr>
                <th class="border" id="tname">Name</th>
                <th class="border"><a class="event" href="">Duration</a></th>
                <th class="border"><a class="event" href="">State</a></th>
                <th class="border"><a class="event" href="">Party</a></th>
                <th class="border"><a class="event" href="">Year</a></th>
            </tr>
        </thead>
        <tbody id="tbodyid">
            <tr>
                <td id="tdid" class="border1">oSB.Append(sNameValue)</td>
                <td class="border1">oSB.Append(sDurValue)</td>
                <td id="td_state" class="border1">oSB.Append(sStateValue)</td>
                <td class="border1">oSB.Append(sPartyValue)</td>
                <td class="border1">oSB.Append(sYearValue)</td>
            </tr>
        </tbody>
</table>

<script>
  $('table[id=table_id]').on('click', 'a.event',function(event){
      event.preventDefault();
      alert('clicked: ' + $(event.currentTarget).text());
      return false;
  });
</script>