JSFiddle - React, Tailwind, and code Playground

by GeraldS

HTML

<span class="input" tabindex="1">&euro;<input type="text"></span>

CSS

.input {
  background: #FFF;
  padding: 5px 10px;
}
.input input {
  border: 0;
  background: #FFF;
  padding-left: 5px;
}
.input input:focus {
  outline: none;
}
.input:focus {
  outline: 1px solid orange;
}

JavaScript

$('.input input').focus(
  function() {
    $(this).parent().css("outline", "1px solid orange");
  }).blur(
  function() {
      $(this).parent().css("outline", "none");
  });