JSFiddle - React, Tailwind, and code Playground

by zephyr_hex

HTML

<button id="btnAdd" type="button">
Add Row
</button>
<div id="divResult"></div>
<table id="order-table"></table>

CSS

td {
  border: 1px solid black;
}

tr:hover {
  cursor: pointer;
}

JavaScript

$(document).ready(function() {

  $('#btnAdd').on('click', function() {
    var row = $("<tr>");
    for (var i = 0; i < 5; i++) {
      var cell = $('<td>');
      cell.text((i+3) * Math.floor(Math.random() * 100));
      row.append(cell);
    }
    $('#order-table').append(row);
  });

  $('#order-table').on('click', 'tr', function() {
    var value = $(this).find('td:first-child').text();
    $('#divResult').text("Value in first cell: " + value);
  });
});