Код JQuery внутри клонированного элемента связан неправильно [дубликат]

Это распространенная проблема с использованием плагинов для динамически добавленных элементов. Обычно требуется вызвать плагин для новых элементов после того, как они вставлены в DOM. Вместо того, чтобы дублировать один и тот же код для элементов начальной загрузки страницы и новых элементов, вы обычно можете создать простую вспомогательную функцию, которая использует родительский элемент в качестве основной ссылки и ищет только внутри этого элемента для элементов, к которым применяется плагин.

Важно: вы повторяете идентификаторы, когда клонируете новые строки, а идентификаторы должны быть уникальными на странице по определению. Следующий код меняет ваш идентификатор на класс, и вам нужно будет сделать то же самое в своей разметке.

var $table;
$(function() {
     $table=$('#myTable'); 
     var $existRow=$table.find('tr').eq(1);
      /* bind to existing elements on page load*/
      bindAutoComplete($existRow);
});

function addRow(){
    var $row=$table.find('tr:last').clone(true);
    var $input=$row.find('input').val("");
    $table.append($row);
    bindAutoComplete($row );
    $input.focus();

}


function bindAutoComplete($row ){
    /* use row as main element to save traversing back up from input*/
    $row.find(".product_title").autocomplete(products, {
        width: 380,
        matchContains: "word",
        formatItem: function(row) {
            return row.title;
        }
    });
    $row.find('.product_title').result(function(event, data) {
        $row.find('.product_description').val(data.description);
    });
}