JSFiddle - React, Tailwind, and code Playground

HTML

<form>
<input type="text" id="nombre" name="nombre" placeholder="Nombre" required/>
<p>*La primera letra debe ser la elegida por el jugador en turno.</p>
</form>

CSS

input:valid +p { display:none }
input:invalid +p { 
  display:block;
  color: firebrick;
  font-style: italic;
}

JavaScript

$("form").find("input[type=text]").attr("pattern", "(?=[Aa])(?!.*(.)\\1\\1).*");

// If I type any word that don't star with A, the message is displayed
// But if I type things like Aaaaaaa it doesn't shows