JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://cdn.kendostatic.com/2011.3.1129/js/kendo.all.min.js"></script>
<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1129/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2011.3.1129/styles/kendo.default.min.css">
<div id="ed_costGrid" style="margin-bottom:10px;"></div>
<div id="ed_grid" style="margin-bottom:10px;"></div>

JavaScript

var productModel = new kendo.data.Model.define({
    fields: {
        accountId: {type: "string", editable: false},
        product: {type: "string", editable: false}
    }
});    
    
$("#ed_grid").kendoGrid({
    selectable: false,
    height: "171px",
    dataSource: {
        schema: {
            model: productModel
        }            
    },
    editable: true,
    toolbar: [
        {text: "New Loan", className: "add-loan", imageClass: "k-add"},
        {text: "New Woring Capital", className: "add-wc", imageClass: "k-add"}
    ],
    columns:[
        {
            field: "accountId",
            title: "Account ID",
            width: "110px"
        },
        {
            field: "product",
            title: "Product",
            width: "110px"
        }
    ]
});
    
var feeModel = new kendo.data.Model.define({
    fields: {
        fee: {type: "string", editable: false},
        amount: {type: "number", editable: false}
    }
});
    
$('#ed_costGrid').kendoGrid({
    selectable: false,
    height: "151px",
    dataSource: {
        schema: {
            model: feeModel
        }
    },
    editable: true,
    toolbar: [
        {text: "Add Fee/Cost", className: "add-fee", imageClass: "k-add"}
    ],
    columns:[
        {
            field: "fee",
            title: "Fee/Cost Type"
        },
        {
            field: "amount",
            title: "Amount"
        }
    ]
});
    
$('#ed_grid a.add-loan').click(function(e) {

    var dataSource = $('#ed_grid').data('kendoGrid').dataSource;
      dataSource.add({accountId:"2097649345",product:"Loan"});
});
    
$('#ed_grid a.add-wc').click(function(e) {

    var dataSource = $('#ed_grid').data('kendoGrid').dataSource;
    dataSource.add({accountId:"2097028374",product:"Working Capital"});
});
    
$('#ed_costGrid a.add-fee').click(function(e) {
    
    var grid = $('#ed_costGrid').data('kendoGrid');
    grid.dataSource.add({fee:"Corporate Fee", amount:2343453});
});