JSFiddle - React, Tailwind, and code Playground

HTML

<input type = "text" name = "name" /><p> salut </p>

CSS

[name="name"]+p {position: relative;display: inline-block;vertical-align: middle;margin-left: 30px;padding: 0 30px 0 25px;font: 14px/24px sans-serif;background: #E8E573;opacity: 0;transition:opacity .4s ease;}
[name="name"]+p:before {content: "";position: absolute;left: -24px;border: 12px solid transparent;border-right-color: #E8E573;}

JavaScript

var myInput = document.querySelector("[name=name]");

myInput.addEventListener("keyup", function(e){
	myInput.nextSibling.style.opacity = myInput.value.length > 0 ? "1" : "0";
}, false);