JSFiddle - React, Tailwind, and code Playground

by j3210938120

HTML

<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://cdn.datatables.net/1.10.16/js/jquery.dataTables.min.js"></script>
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.16/css/jquery.dataTables.min.css">
<table id="myTable"></table>
    <div id="loadingLabel">Loading...</div>

JavaScript

const getNewCases = async() => {
      const response = await fetch('https://covid19.mathdro.id/api/daily/3-18-2020');
      const data = await response.json();
      let usa = data.filter(val => {
        return val.countryRegion === 'US';
      });
      $('#loadingLabel').hide();
      $('#myTable').DataTable({
        data: usa,
        bLengthChange: false,
        bPaginate: false,
        scrollY:        '50vh',
        columns: [
          { data: 'provinceState', title: 'State' },
          { data: 'countryRegion', title: 'Country' },
          { data: 'lastUpdate', title: 'Last Update' },
          { data: 'confirmed', title: 'Confirmed' },
          { data: 'deaths', title: 'Deaths' },
          { data: 'recovered', title: 'Recovered' },
          {data:'null',
            title: "random",
            className: "sum",
            render: function(data, type, row) {
                return parseInt( data.deaths) + parseInt(data.recovered);
            }
        }
        ]
      });
    };
    getNewCases();