JSFiddle - React, Tailwind, and code Playground

by Mohit Kumar Gupta

HTML

<a class="add">Add a row!</a><br>

<table class="the-table">
  <thead>
    <tr><th>Heading One</th><th>Heading Two</th></tr>
  </thead>
  <tbody>
    <tr class="element"><td>Right-Click Me</td><td>Or Me</td></tr>
  </tbody>
</table>

CSS

tr, td, th { border: 1px solid black; }
.add { cursor: pointer; }

JavaScript

$(document).on("contextmenu", ".element", function(e){
   alert('Context Menu event has fired!');
   return false;
});

$(document).on('click', '.add', function(){
   $('.the-table').append('<tr class="element"><td>Right-Click Me</td><td>Or Me</td></tr>');
});