JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="usuario" type="text" placeholder="Digite seu login: " />
<br/>
<br/>
<input id="senha" type="password" placeholder="Digite sua senha: " />
<br/>
<br/>
<input type="button" value="Fazer login" onclick="validarUsuarioSenha()" />
<br/>
<br/>
<div id="loginCorreto">Login efetuado com sucesso!</div>
<div id="loginErrado">Usuário ou senha inválidos!</div>

CSS

#loginCorreto {
    width: 235px;
    height: 20px;
    background: green;
    color: #FFFFFF;
    display: none;
}
#loginErrado {
    width: 235px;
    height: 20px;
    background: red;
    color: #FFFFFF;
    display: none;
}

JavaScript

var username = "admin";
var password = "admin";


function validarUsuarioSenha() {
    var u = document.getElementById('usuario');
    var s = document.getElementById('senha');
    if (u.value == username && s.value == password) {
        $("#loginCorreto").show();
    } else {
        $("#loginErrado").show();
    }
}