JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>the jQuery Datagrid</title>
<!-- this stylesheet is for page styling only -->
<style media="all" type="text/css">@import "css/site.css";</style>

<!-- include jquery lib -->
    <script type="text/javascript" src="http://reconstrukt.com/ingrid/src/js/jquery.js"></script>
<!-- include ingrid lib -->
    <script type="text/javascript" src="http://reconstrukt.com/ingrid/src/js/jquery.ingrid.js"></script>
<!-- ingrid default stylesheet -->
    <style media="all" type="text/css">@import "http://reconstrukt.com/ingrid/src/css/ingrid.css";</style>
<!-- to make ingrid save her state (selected rows, page number, column sort & direction); just include the jQ cookie plugin -->
    <script type="text/javascript" src="http://reconstrukt.com/ingrid/src/js/jquery.cookie.js"></script>

<!-- initialize -->
<script type="text/javascript">
$(document).ready(
    function() {
        
        // create the grid
        // returns a jQ object with a 'g' property - that's ingrid
        var mygrid1 = $("#table1").ingrid({ 
    url: 'http://example.com/serverside.php',
          height: 350,
          savedStateLoad: false,
          rowClasses: ['grid-row-style1',
          'grid-row-style1',
          'grid-row-style2',
          'grid-row-style1',
          'grid-row-style1',
          'grid-row-style3'],
           onRowSelect: function(tr, selected){                                            
           var str         = selected ? 'SELECTED' : 'UNSELECTED';
           var tr_html    = $(tr).html();                                            
            alert( str + ' Row. InnerHTML is : ' + tr_html);                                                                                        
                                        }                                        
                                    });
        

       ...