JQuery: как очистить элемент до добавления нового контента?

Это мой код jquery

 $.ajax({
   url: "PopUpProductDetails.aspx",
            cache: false
     }).done(function (html) {
     $("#dialog").append(html);
 });

В первый раз он работает отлично. Он отображает содержимое страницы PopUpProductDetails.aspx. Но после этого, если я снова нажму, я получаю вдвое больше контента и т.д. Я считаю, что проблема заключается в том, что сначала нужно очистить элемент dialog, прежде чем добавлять новый контент.

Как это сделать?

Ответ 1

.append() добавляет html в конец существующей строки html, используйте .html() для замены того, что в настоящее время находится внутри #dialog.

Ответ 2

Внутри функции сначала очистить диалоговое окно, а затем заполнить содержимое

$.ajax({
   url: "PopUpProductDetails.aspx",
            cache: false
     }).done(function (html) {
     $("#dialog").html("");
     $("#dialog").html(html);
 });