Autocomplete in Dynamic input

Good Morning, folks. I'm trying to implement autocomplete on dynamic input but it doesn't work. Already test calling class or id and nothing.

Follow the code so they can give me a light showing where I am going wrong. Jquery function that I add row in a table dynamically. and the autocomplete function in the product description Field

        $(document).ready(function(){

                //Atribui o evento click a classe .btn-insert-field
                $('.btn-insert-field').click(function(e){
                    //Remove ação padrão do link para não atualiza a página
                    e.preventDefault();

                    //Define o elemento onde será inserido os campos
                    var target  = $("#target");
                    //total de linhas criadas dinamicamente
                    //Será utilizado com indices pra serem removidos mais facilmente
                    var total = $("#target tr").length;
                    //Cria estrutura que será inserida
                    var html   = '<tr class="row-field-'+total+'">';
                            html   += '<td><input type="number" id="qtt" name="qtt[]" /></td>';
                            html   += '<td><input type="text" class="descri" id="descri" name="descri[]" style="text-transform:uppercase"  /></td>';
                            html   += '<td><a href="#" class="btn btn-danger btn-sm  btn-delete-row" data-id="'+total+'">X</a></td>';
                        html   += '<tr>';

                    //Adiciona no final do elemento que foi selecionado anteriormente
                    target.append(html);
                });

                //Atribui a classe .btn-delete-row o evento click
                //É usado on porque o elemento será criado dinamicamente
                $(document).on('click', '.btn-delete-row', function(e){
                    //Remove ação padrão do link para não atualiza a página
                    e.preventDefault();
                    //pega o valor do data-id
                    var id  = $(this).data('id');
                    //Remove a linha
                    $('.row-field-'+id).detach();

                });

                $(document).on('DOMNodeInserted','.descri', function(){
                    $(this).autocomplete({
                        source:'pesquisa_produto.php'
                    });
                });



            });

Inside my html I show in a div- >

                                        <div class="off-3 col-6">
                                                    <table class="actions">
                                                        <thead>
                                                            <tr>
                                                                <th>Quantidade</th>
                                                                <th>Descrição</th>
                                                                <th width="5"><a href="#" class="btn btn-primary btn-insert-field">Adicionar</a></th>
                                                            </tr>
                                                        </thead>
                                                        <tbody id="target"> <!-- aqui aparece a linha da tabela com 2 campos input criados automaticamentes -->

                                                        </tbody>
                                                    </table>
                                            </div>

When I call the autocomplete function outside the input dynamic works perfectly.