How to get the searched item with autocomplete?

Question

I have an autocomplete that works perfectly. How do I pick up the searched item and place it inside a div? Type x-salad search and when you click it put x-salad inside the div. The function Autocompleteselecthandler(Event, ui) returns nothing.

// BUSCA COM AUTOCOMPLETE
var resultadoLanche = [];
// Captura o retorno do retornaCliente.php
$.ajax({
  url: urlBase + "produtos?filter[categoria_id]=" + idcategoria,
  method: 'GET',
  success: function(retorno)
  {

    retorno.data.forEach(function(item)
    {
      resultadoLanche.push(item.nome);

    });
  },
  error: function(XMLHttpRequest, textStatus, errorThrown)
  {
    alert("Status do Servidor: " + textStatus);
    alert("Erro do Servidor: " + errorThrown);
  }
});

// ativar o autocomplete
$('#buscarProduto').autocomplete(
  {
    source: resultadoLanche,
    select: function(event, ui)
    {
      $('#buscarProduto').val(ui.item.value);
    },
    minLength: 3
  }
);

function AutoCompleteSelectHandler(event, ui)
{
  alert('teste');
var teste = $('#buscarProduto').val(ui.item.value);

}

Answer 1

Tries to replace:

$('#buscarProduto').val(ui.item.value);

By the ID of the respective div and the . text function()

$('#divParaExibir').text(ui.item.value);

Answer 2

It is not necessary to use the function Autocompleteselecthandler in this case. Just here in your select

select: function(event, ui)
{
  $('#buscarProduto').val(ui.item.value);
},

you replace the code $('#buscarProduto').val(ui.item.value); for $('#buscarProduto').html(ui.item.value);. If the value shall be inserted in the div. Normally the val() enters and captures information from inputs. Take this test and see if you can solve it!