JSFiddle - React, Tailwind, and code Playground

by Kiran Duggal

HTML

<div>
  <input id="theInput" class="someClassName" type="text" value="100" readonly />
  <a class="EditLink" href="#">Edit</a>
  <a class="ResetLink" href="#">Reset</a>
</div>

JavaScript

$(document).ready(function() {

    $(document).on('click', '.EditLink', function() {
      $("#theInput").data('originalValue', $("#theInput").val());
      $("#theInput").prop('readonly', '');
      
    });

    $(document).on('click', '.ResetLink', function() {
      $("#theInput").val($("#theInput").data('originalValue'));
      $("#theInput").prop('readonly', 'true');
    });

  });