使用JQuery从AJAX请求中断HTML

我正在解析一个XML文件并试图将输出返回到div。但是，由于某些原因，.append（）似乎无法生成正确的HTML输出

以下是JQuery代码段：

var list = $('<div class="response">').appendTo(this);
list.append('<ul>');

$('item',data).each(function(i){
    var dow = $(this).find("day").text();
    var high = $(this).find("high").text();
    var low = $(this).find("low").text();
    var conditions = $(this).find("conditions").text();
    var icon = $(this).find("icon").text();

    list.append('<li style="background: url(' + icon + '.gif) no-repeat;"><b>' + dow + '</b> - ' + conditions + ' (Hi: ' + high + ', Low: ' + low + ')</li>');          
});

var list=$（''）.appendTo（此）；
追加（“
”）；
$（'item'，data）。每个（函数（i）{
var dow=$（this.find（“day”）.text（）；
var high=$（this.find（“high”）.text（）；
var low=$（this.find（“low”）.text（）；
var conditions=$（this.find（“conditions”）.text（）；
var icon=$（this.find（“icon”）.text（）；
list.append（'
'+dow+'-'+conditions+'（Hi:'+high+'，Low:'+Low+'）
'）；
});

它生成的HTML如下所示：

<div class="response"></div>
<ul></ul>
    <li style="background: url(partlycloudy.gif) no-repeat;"><b>Wednesday</b> - Partly Cloudy (Hi: 50, Low: 43)</li>
    <li style="background: url(partlycloudy.gif) no-repeat;"><b>Thursday</b> - Partly Cloudy (Hi: 59, Low: 34)</li>
    <li style="background: url(partlycloudy.gif) no-repeat;"><b>Friday</b> - Partly Cloudy (Hi: 45, Low: 25)</li>
    <li style="background: url(chancesnow.gif) no-repeat;"><b>Saturday</b> - Chance of Snow (Hi: 36, Low: 22)</li>
    <li style="background: url(partlycloudy.gif) no-repeat;"><b>Sunday</b> - Partly Cloudy (Hi: 36, Low: 20)</li>
    <li style="background: url(partlycloudy.gif) no-repeat;"><b>Monday</b> - Partly Cloudy (Hi: 34, Low: 20)</li>

周三-部分多云（高：50，低：43）
周四-多云（高：59，低：34）
周五-部分多云（高：45，低：25）
周六-下雪的几率（高：36，低：22）
周日-多云（高：36，低：20）
周一-部分多云（高：34，低：20）

知道为什么标签会提前关闭吗？我有点不知所措。如果有其他方法我应该这样做，我会很感激你给我指出正确的方向

---

提前谢谢

附加UL时，它会附加一个完全成形的闭合元素。最好将整个HTML构建为字符串，然后立即追加整个字符串。

append（）

不是字符串追加。它正在处理实时DOM。当您附加一个

时，它会自动添加结束标记。之后添加到标记中的任何内容都将在以后进行

相反，试试这个

var list = $('<div class="response">').appendTo(this);
var ul = $('<ul></ul>');

$('item',data).each(function(i){
    var dow = $(this).find("day").text();
    var high = $(this).find("high").text();
    var low = $(this).find("low").text();
    var conditions = $(this).find("conditions").text();
    var icon = $(this).find("icon").text();

    ul.append('<li style="background: url(' + icon + '.gif) no-repeat;"><b>' + dow + '</b> - ' + conditions + ' (Hi: ' + high + ', Low: ' + low + ')</li>');          
});
list.append(ul);

var list=$（''）.appendTo（此）；
var ul=$（“
”）；
$（'item'，data）。每个（函数（i）{
var dow=$（this.find（“day”）.text（）；
var high=$（this.find（“high”）.text（）；
var low=$（this.find（“low”）.text（）；
var conditions=$（this.find（“conditions”）.text（）；
var icon=$（this.find（“icon”）.text（）；
ul.append（'
'+dow+'-'+conditions+'（Hi:'+high+'，Low:'+Low+'）
'）；
});
列表。附加（ul）；

工作正常。谢谢Chetan！