JSFiddle - React, Tailwind, and code Playground

by Zakaria Acharki

HTML

<input type="text" name="customername" class="input" value="" disabled />

<div style="float:right;cursor:pointer;margin:2px 0 0 0px;" id="clickinput1">
  <img src="https://cdn4.iconfinder.com/data/icons/simplicio/128x128/document_edit.png" /> button
</div>

CSS

.input {
  border: 0px;
  outline: none;
  background: #ccc;
  height: 20px;
  width: 250px;
  font: 18px Calibri;
  margin-top: 1px;
}

JavaScript

$(document).ready(function() {
  $("#clickinput1").click(function(evt) {
    $(this).hide().prev("input[disabled]").prop("disabled", false).css("background-color", "white").focus();
  });
});