JSFiddle - React, Tailwind, and code Playground

HTML

<table border="0" id="codeTable">
    <tr>
        <td style="font-weight: bold;">Original Coding</td>
        <td><input type="text" id="originalCoding" size="50" value=""></td>
    </tr>
    <tr>
        <td colspan="2" align="center"><input type="button" id="doIt" value="--> Do It <--">
    </tr>
    <tr>
        <td style="font-weight: bold;">New Coding</td>
        <td><input type="text" id="newCoding" size="50"></td>
    </tr>    
</table>

CSS

#codeTable td {
    padding: 4px;
}

JavaScript

$('#doIt').click(function() {
    var originalCoding = $('#originalCoding').val();
    var newCoding = 'empty';
    var regexPattern = '^([0-9A-F]{12})([0-9A-F]{2})([0-9A-F]{14})([0-9A-F]{2})([0-9A-F]{8})$';
    
    var matches = originalCoding.match(regexPattern);
    
    if (matches && matches.length == 6){
        newCoding = matches[1] + '80' + matches[3] + '01' + matches[5];
        
        $('#newCoding').val(newCoding);
    } else {
        alert('Invalid long code provided.  Please verify and try again.');
    }
});