JSFiddle - React, Tailwind, and code Playground

HTML

<html><body>
  <table><tr>
    <th></th>
    <th>Sample<br/>01</th>
    <th>Sample<br/>02</th>
    <th>Sample<br/>03</th>
    <th>Sample<br/>04</th>
    <th>Sample<br/>05</th>
  </tr><tr>
    <th>Group 01</th>
    <td>
      <input type="text" tabindex="1" class="sample-value" 
             name="edtG01S01" id="edtG01S01"/>
      <br/>
      <input type="checkbox" tabindex="-1" name="cbxG01S01" id="cbxG01S01"/> &lt;1
    </td>
    <td>
      <input type="text" tabindex="2" class="sample-value" 
             name="edtG01S02" id="edtG01S02"/>
      <br/>
      <input type="checkbox" tabindex="-1" name="cbxG01S02" id="cbxG01S02"/> &lt;1
    </td>
    <td>
      <input type="text" tabindex="3" class="sample-value" 
             name="edtG01S03" id="edtG01S03" disabled="disabled"/>
      <br/>
      <input type="checkbox" tabindex="-1" name="cbxG01S03" id="cbxG01S03"/> &lt;1
    </td>
    <td>
      <input type="text" tabindex="4" class="sample-value" 
             name="edtG01S04" id="edtG01S04"/>
      <br/>
      <input type="checkbox" tabindex="-1" name="cbxG01S04" id="cbxG01S04"/> &lt;1
    </td>
    <td>
      <input type="text" tabindex="5" class="sample-value" 
             name="edtG01S05" id="edtG01S05"/>
      <br/>
      <input type="checkbox" tabindex="-1" name="cbxG01S05" id="cbxG01S05"/> &lt;1
    </td>
  </tr><tr>
    <th>Group 02</th>
    <td>
      <input type="text" tabindex="6" class="sample-value" 
             name="edtG02S01" id="edtG02S01"/>
      <br/>
      <input type="checkbox" tabindex="-1" name="cbxG02S01" id="cbxG02S01"/> &lt;1
    </td>
    <td>
      <input type="text" tabindex="7" class="sample-value" 
             name="edtG02S02" id="edtG02S02"/>
      <br/>
      <input type="checkbox" tabindex="-1" name="cbxG02S02" id="cbxG02S02"/> &lt;1
    </td>
    <td>
      <input type="text" tabindex="8" class="sample-value" 
             name="edtG02S03" id="edtG02S03" disabled="disabled"/>
      <br/>
      <input type="checkbox"...

CSS

* {
  font-family: Arial;
}
input.sample-value {
  width: 50px;
}
th, td {
  padding: 10px;
}

JavaScript

$('input.sample-value').keyup(function(event) {
  if (event.which == 39) { /* right arrow key */
    $(this).parent('td').next('td').find('input.sample-value').focus();
    event.preventDefault();
  }
  if (event.which == 37) { /* left arrow key */
    $(this).parent('td').prev('td').find('input.sample-value').focus();
    event.preventDefault();
  }
});