JSFiddle - React, Tailwind, and code Playground

by dandrade78

HTML

<input type="number" pattern="[0-9]*" inputmode="numeric" maxlength="2" placeholder="DD" name="dobday" id="dobday">
<div class="separator">/</div>
<input type="number" pattern="[0-9]*" inputmode="numeric" maxlength="2" placeholder="MM" name="dobmonth" id="dobmonth">
<div class="separator">/</div>
<input type="number" pattern="[0-9]*" inputmode="numeric" maxlength="4" placeholder="YYYY" name="dobyear" id="dobyear">

JavaScript

$('input#dobday,input#dobmonth,input#dobyear').on('input', function(e) {
    if (jQuery(this).val().length >= parseInt(jQuery(this).attr("maxlength"), 10)) {
            if (jQuery(this).attr('id') === 'dobyear') {
                jQuery(this).blur();
            } else {
                jQuery(this).nextAll('input:first').focus();
            }
    }
}