JSFiddle - React, Tailwind, and code Playground

HTML

<div id="message"><a href="#">Some link</a></div>
<div id="fail">Invalid postcode</div>
<input type="text" id="myInput" />

JavaScript

$(function () {
    $("#message").hide();
    $("#fail").hide();

    var prefix = ['HX', 'HD', 'BD', 'LS'];
    var links = ['http://www.facebook.com','http://www.example.com','http://www.bbc.com','#'];

    $('#myInput').keyup(function (e) {
        var value = $(this).val();
        var firstTwo = value.substr(0, 2);
        var firstTwoUpper = firstTwo.toUpperCase();

        if (firstTwo != firstTwoUpper) {
            $(this).val(value.replace(/^\w\w/, firstTwoUpper));
        }
        if (value.length > 1) {
            var index = $.inArray(firstTwoUpper, prefix);
            if (index >= 0) {
                $("#fail").hide();
                $("#message").fadeIn();
                $("#message a").attr("href",links[index]).html(links[index])
            } else {
                $("#message").hide();
                $("#fail:hidden").fadeIn();
            }
        } else {
            $("#message").hide();
            $("#fail").hide();
        }
    });
});