JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script src="http://www.appelsiini.net/download/jquery.jeditable.js"></script>
<div id="field1"></div>
<div id="field2"></div>
<div id="field3"></div>
<button type="button" id="save">Done</button>

JavaScript

$(document).ready(function() {
    var val1 = "";
    var val2 = "";
    var val3 = "";
   $("#field1").editable(function(value, settings) {                                 
                                val1= value;                                                               
                                return(value);
                     }, {width:"125px", placeholder: "First Name", "submit" : "OK", onblur: "submit"}
                  );
   $("#field2").editable(function(value, settings) {                                 
                                val2= value;                                                              
                                return(value);
                     }, {width:"125px", placeholder: "Last Name", "submit" : "OK", onblur: "submit"});
   $("#field3").editable(function(value, settings) {                                 
                                val3= value;                                                              
                                return(value);
                     }, {width:"125px", placeholder: "email", "submit" : "OK", onblur: "submit"});
    
    $("#save").click(function() {
        if (val1 != "" && val2 != "" && val3 != "") {
            alert("Done editing. This is where I want to clear my fields!");
        } else {
            alert("Missing fields");
        }
    });
});