jQuery .Append()方法产生不需要的结果

Question

我正在使用Wikipedia的API进行项目。我已经能够成功加载API的数据。 但是，这是我尝试在提交输入值时尝试将API结果加载到DOM的问题，但是每次我尝试提交新值时，结果都会从第一个输入搜索中将结果附加到初始结果中。p>这是一个小提琴，可能表明我的意思：

https://jsfiddle.net/aonz929f/1/

    for( var key in data.query.pages){
        //loop through the JSON data 
       }
$("#result").append(htmlContent)/// Then I used the append method to return each returned result to the DOM

Answer 1

您必须在附加新的HTML之前清除已经存在的HTML，例如：

$("#result").html("")
for( var key in data.query.pages){
   $("#result").append(("<p>" + data.query.pages[key].title) + "</p>")
   //etc..        
}