JSFiddle - React, Tailwind, and code Playground

by ChrisStanyon

HTML

<div class="inp" id="inpGangID">
    <select id="comGangID" name="comGangID" size="1"></select>
    <img id="chris" class="freeInput" src="img/freeInput.png" alt="Free Input" />
</div>

JavaScript

$(document).ready(function () {
    $('img.freeInput').click(changeToFreeInput);
});

function changeToFreeInput() {
    var div = $(this).parent().empty();
    var myInput = $('<input/>', { id: $(this).attr('id'), value: $(this).attr('id'), type: 'text' }).blur(saveChanges).appendTo(div);
}

function saveChanges() {
    alert($(this).attr("id") + " = " + $(this).val() );
}