JSFiddle - React, Tailwind, and code Playground

HTML

<div id="message"></div>
<input type="text" id="myInput" />

JavaScript

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

    var prefix = [{code:'HX',link:'www.facebook.com'}, {code:'BD',link:'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) {
        for(var obj in prefix){
            console.log(firstTwoUpper, prefix[obj].code, firstTwoUpper == prefix[obj].code);
            if(firstTwoUpper === prefix[obj].code){
                 $("#fail").hide();
                var link = '<a href="'+prefix[obj].link+'">'+prefix[obj].link+'</a>';
                $("#message").append(link);
                $("#message:hidden").fadeIn();
                break;
            }else {
                $("#message").hide();
                $("#fail:hidden").fadeIn();
            }
        };
    } else {
        $("#message").empty();
        $("#message").hide();
        $("#fail").hide();
    }
 });
});