JSFiddle - React, Tailwind, and code Playground
HTML
<script src="https://rawgit.com/gelo32k/publicFiles/master/jquery-ui-1.11.4.js"></script>
<link rel="stylesheet" href="https://rawgit.com/gelo32k/publicFiles/master/jquery-ui.css">
<link rel="stylesheet" href="https://rawgit.com/free-jqgrid/jqGrid/master/css/ui.jqgrid.css">
<script src="https://rawgit.com/free-jqgrid/jqGrid/master/js/i18n/grid.locale-en.js"></script>
<script src="//rawgit.com/free-jqgrid/jqGrid/master/js/jquery.jqgrid.src.js"></script>
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
<script src="https://rawgit.com/gabceb/jquery-browser-plugin/master/dist/jquery.browser.js"></script>
<div style="position: absolute; z-index: 0">
<h2> test </h2>
</div>
<div style="position: absolute; z-index: 0">
<table id="navgrid"></table>
<div id="pagernav"></div>
</div>
JavaScript
var mystr = "<rows><page>1</page><total>2</total><records>13</records><row id='13'><cell>13</cell><cell>2007-10-06</cell><cell>Client 3</cell><cell>1000.00</cell><cell>0.00</cell><cell>1000.00</cell><cell>No</cell><cell>TNT</cell><cell></cell></row><row id='12'><cell>12</cell><cell>2007-10-06</cell><cell>Client 2</cell><cell>700.00</cell><cell>140.00</cell><cell>840.00</cell><cell>No</cell><cell>FedEx</cell><cell></cell></row><row id='11'><cell>11</cell><cell>2007-10-06</cell><cell>Client 1</cell><cell>600.00</cell><cell>120.00</cell><cell>720.00</cell><cell>No</cell><cell>FedEx</cell><cell></cell></row><row id='10'><cell>10</cell><cell>2007-10-06</cell><cell>Client 2</cell><cell>100.00</cell><cell>20.00</cell><cell>120.00</cell><cell>Yes</cell><cell>TNT</cell><cell></cell></row><row id='9'><cell>9</cell><cell>2007-10-06</cell><cell>Client 1</cell><cell>200.00</cell><cell>40.00</cell><cell>240.00</cell><cell>No</cell><cell>TNT</cell><cell></cell></row><row id='8'><cell>8</cell><cell>2007-10-06</cell><cell>Client 3</cell><cell>200.00</cell><cell>0.00</cell><cell>200.00</cell><cell>No</cell><cell>FedEx</cell><cell></cell></row><row id='7'><cell>7</cell><cell>2007-10-05</cell><cell>Client 2</cell><cell>120.00</cell><cell>12.00</cell><cell>134.00</cell><cell>Yes</cell><cell>TNT</cell><cell></cell></row><row id='6'><cell>6</cell><cell>2007-10-05</cell><cell>Client 1</cell><cell>50.00</cell><cell>10.00</cell><cell>60.00</cell><cell>No</cell><cell>FedEx</cell><cell></cell></row><row id='5'><cell>5</cell><cell>2007-10-05</cell><cell>Client 3</cell><cell>100.00</cell><cell>0.00</cell><cell>100.00</cell><cell>No</cell><cell>FedEx</cell><cell>no tax at all</cell></row><row id='4'><cell>4</cell><cell>2007-10-04</cell><cell>Client 3</cell><cell>150.00</cell><cell>0.00</cell><cell>150.00</cell><cell>Yes</cell><cell>TNT</cell><cell>no tax</cell></row></rows>"
jQuery("#navgrid").jqGrid({
datatype: "xmlstring",
datastr: mystr,
colNames:['Inv No','Date', 'Client',...