JSFiddle - React, Tailwind, and code Playground

HTML

<div class="caixa-pesquisa">
   <div class="caixa-pesquisa-input">
      <input type="text" class="pesquisa-class" value="Digite o produto desejado...">   
         <div class="caixa-pesquisa-btn"><a class="btn-buscar" href="#">buscar</a></div>
   </div>
</div>

JavaScript

$(document).ready(function () {
    // armazena valor
    $('.pesquisa-class').get(0).defaultValue = $('.pesquisa-class').val();
    // limpa valor
    $('.pesquisa-class').click(function(){
        if($(this).val() == this.defaultValue) $(this).val('');
    });
    // recupera valor
    $('.pesquisa-class').blur(function(){
        if($(this).val() == '') $(this).val(this.defaultValue);
    });
});