JSFiddle - React, Tailwind, and code Playground

HTML

<table><tr><th></th><th>22oz Dark</th><th>12ct 4oz Dark</th></tr><tr><th>2016-01-01</th><td>9785</td><td>2478</td></tr><tr><th>2016-01-02</th><td>8754</td><td>2136</td></tr><tr><th>2016-01-03</th><td>13587</td><td>2203</td></tr><tr><th>2016-01-04</th><td>14111</td><td>3297</td></tr><tr><th>2016-01-05</th><td>13212</td><td>3101</td></tr><tr><th>2016-01-06</th><td>16335</td><td>3299</td></tr><tr><th>2016-01-07</th><td>15421</td><td>3100</td></tr></table>

CSS

table,th, td {
  
    border: 1px solid black;
    border-collapse: collapse;
    font-size: 90%;
        
}

th, td {
    
    padding:8px;
    
}

td {
    
    text-align: center;
    
}

table {
    
    margin:0 auto;
    
}

JavaScript

$('td').click(function(){
                    $(this).html("<contenteditable>");
                });