JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://igniteui.com/js/modernizr.min.js"></script>
<script src="https://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="https://code.jquery.com/ui/1.10.3/jquery-ui.min.js"></script>
<script src="https://cdn-na.infragistics.com/igniteui/latest/js/infragistics.loader.js"></script>
<script src="https://igniteui.com/data-files/adventureworks.min.js"></script>

<table id="grid"></table>

JavaScript

$(function () {
$.ig.loader({
			scriptPath: "https://cdn-na.infragistics.com/igniteui/latest/js/",
			cssPath: "https://cdn-na.infragistics.com/igniteui/latest/css/",
			resources: "igGrid.Sorting",
			ready: function () {
				$("#grid").igGrid({
					autoGenerateColumns: false,
					columns: [
						{ headerText: "ID", key: "ProductID", dataType: "number" },
						{ headerText: "Name", key: "Name", dataType: "string" },
						{ headerText: "Number", key: "ProductNumber", dataType: "string" },
						{ headerText: "Cost", key: "StandardCost", dataType: "number" }
					],
					dataSource: adventureWorks,
					height: "400px",
					features: [
						{
							name: "Sorting",
							type: "local",
							mode: "multiple"
						}
					]
				});
			}
		});
});