JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" value="hello world">
<br>
<button>pew</button>

CSS

input {
  margin: 5px;
  outline: none;
  padding: 3px 0px 3px 3px;
  border: 1px solid #ddd;
}
@keyframes green-flash {        
  from {
    box-shadow: 0 0 10px green;
  }
  to {
    box-shadow: 0 0 0px green;
  }      
}

.make-it-flash {
  position: relative;
  animation: green-flash 3s ease-out;
}

JavaScript

let button = document.querySelector('button'),
input = document.querySelector('input')

button.addEventListener('click', function() {
	restartAnimation(input, 'make-it-flash')
})

function restartAnimation(elem, classname) {
  elem.classList.remove(classname);
  void elem.offsetWidth;
  elem.classList.add(classname);
}