JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="my_input" value="Click me." />
<div id="result"></div>

JavaScript

$('#my_input').blur(function(){
    $('#result').append("Prevent me without removing the blur() and function that caused me! <br/>");    
    
    var valor = $(this).val();
    $('#result').append(valor);
    if(valor == ''){
          $(this).val('Click to blur');
    }
});

$("#my_input").click(function(){
    $(this).after("<ul>\
                  <li data-value='value1' class='click_me'>Now, click me,</li>\
                  <li data-value='value1' class='click_me'>or me!</li>\
                   </uL>");

    $(".click_me").click(function(){
        $("#my_input").val($(this).data("value"));
        $(this).parent().remove();
        $("#my_input").after("<img src='http://harrisongreetingcards.net/images/1316_thank_you_for_your_time_note_card.png' />");
    })
    
});