JSFiddle - React, Tailwind, and code Playground

HTML

<input list="values" value="apple">
<datalist id="values">
  <option value="orange">
    <option value="banana">
</datalist>

JavaScript

$('input').on('click', function() {
  $(this).val('');
});
$('input').on('mouseleave', function() {
  if ($(this).val() == '') {
    $(this).val('apple');
  }
});