JSFiddle - React, Tailwind, and code Playground

by zaibtabs

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<table id="choose-address-table" class="ui-widget ui-widget-content">
  <thead>
    <tr class="ui-widget-header ">
      <th>Name/Nr.</th>
      <th>Street</th>
      <th>Town</th>
      <th>Postcode</th>
      <th>Country</th>
      <th>Options</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td class="nr"><span>50</span>

      </td>
      <td>Some Street 1</td>
      <td>Glas</td>
      <td>G0 0XX</td>
      <td>United Kingdom</td>
      <td>
        <button type="button" class="use-address btn btn-default">Edit</button>&nbsp&nbsp
        <button type="button" class="EDIT btn btn-info">Delete</button>
      </td>
    </tr>
    <tr>
      <td class="nr"><span>30</span>

      </td>
      <td>Some Street 2</td>
      <td>Glasgow</td>
      <td>G0 0XX</td>
      <td>United Kingdom</td>
      <td>
       <button type="button" class="use-address btn btn-default">Edit</button>&nbsp&nbsp
        <button type="button" class="EDIT btn btn-info">Delete</button>
      </td>
    </tr>

    <tr>
      <td class="nr"><span>40</span>

      </td>
      <td>Some Street 3</td>
      <td>Mental</td>
      <td>BE Ntal</td>
      <td>Crazy Land</td>
      <td>
        <button type="button" class="use-address btn btn-default">Edit</button>&nbsp&nbsp
        <button type="button" class="EDIT btn btn-info">Delete</button>
      </td>
    </tr>
  </tbody>
</table>

JavaScript

$('.use-address').click(function() {
  var id = $(this).closest("tr").find('td:eq(0)').text();
  alert(id);
});

$('.EDIT').click(function() {
  var id = $(this).closest("tr").find('td:eq(4)').text();
  alert(id);
});