JSFiddle - React, Tailwind, and code Playground

HTML

<div class="fillColor1"></div>
<div class="fillColor2"></div><br/>
<button>Click me</button>

CSS

.fillColor1 {
    background: black;
    height: 0;
    margin-left: 24px;
    position: relative;
    width: 3px;
}

.fillColor2 {
    background: black;
    height: 0;
    margin-left: 41px;
    position: relative;
    width: 3px;
}

JavaScript

$.ajax({
    method: 'POST',
    url: "/echo/json/",
    data: {json:JSON.stringify({status:"ok"})},
    dataType: "json",
    headers: {
        "Authorization": "Basic " + btoa('' + "Username" + '' + ":" + '' + "Password" + '')
    },
    success: function(data, textStatus, jqXHR) {
        if (jqXHR.responseJSON.status === "ok") {
            alert('First Real Server Configured');
        }
    },
    statusCode: {
        406 : function() {
            alert('There is an unexpected string in your data.\nFix the error and try again.');
        },
        401 : function() {
            alert('Wrong username or password.');
        }
    }
});