JSFiddle - React, Tailwind, and code Playground
HTML
<input class="id" id="idnumber1" maxlength="1" />
<input class="id" id="idnumber2" maxlength="1" />
<input class="id" id="idnumber3" maxlength="1" />
<input class="id" id="idnumber4" maxlength="1" />
<input class="id" id="idnumber5" maxlength="1" />
<input class="id" id="idnumber6" maxlength="1" />
<input class="id" id="idnumber7" maxlength="1" />
<input class="id" id="idnumber8" maxlength="1" />
<input class="id" id="idnumber9" maxlength="1" />
<input class="id" id="idnumber10" maxlength="1" />
<input class="id" id="idnumber11" maxlength="1" />
<input class="id" id="idnumber12" maxlength="1" />
<input class="id" id="idnumber13" maxlength="1" />
JavaScript
$('input.id').on('keyup', function(){
if (this.value.match(/\d+/)) {
var $this = $(this);
if ($this.next('input').length) {
$this.next().focus();
} else {
validate()
}
}
})