使用动态javascript将InnerHTML放置在正确的位置

我正在动态填充一个div。但是我在innerHTML的位置上遇到了问题。下面的代码将说明这一点

 function update() {
    $.ajax({
    url: '/update/',
    type:"POST",
    cache:false,
    success: function(data) {
        alert(JSON.stringify(data));
        var ul = document.createElement('ul');
        var div = document.getElementById('rightbar');
        for(var i = 0; i < data.length; i++) {
            var li = document.createElement('li');
            var a = document.createElement('a');
            var img = document.createElement('img')
            a.innerHTML = data[i]['fields']['video_title'];
            a.target = "_blank";
            a.href = data[i]['pk'];
            img.src = "media/" + data[i]['fields']['video_thumbnail'];
            a.appendChild(img);
            li.appendChild(a);
            ul.appendChild(li);
        }
        div.innerHTML = "";
        div.appendChild(ul);
    },
    failure: function(data) { 
        alert('Got an error dude');
    }
}); 

函数更新（）{
$.ajax({
url:“/update/”，
类型：“POST”，
cache:false，
成功：功能（数据）{
警报（JSON.stringify（数据））；
var ul=document.createElement（'ul'）；
var div=document.getElementById（'rightbar'）；
对于（变量i=0；i

这为我提供了以下形式的HTML：

<div id = "rightbar">
<ul>
<li><a href = "video_link">video_title<img src = "video_thumbnail"></a></li>
</div>

但我想要的是：

<div id = "rightbar">
<ul>
<li><a href = "video_link"><img src = "video_thumbnail">video_title</a></li>
</div>

请注意“视频标题”在两个HTML中的位置。

var data=[1]；//仅用于示例
var ul=document.createElement（'ul'）；
var div=document.getElementById（'rightbar'）；
对于（变量i=0；i

---

a.appendChild（img）；

在你的

a.innerHTML=data[i]['fields']['video_title']；

交换逻辑。请看这篇文章@a.Lau我试过了，但没用。@ShivamMitra那么你做错了。看看斯隆基的答案，告诉我这与我告诉你的不同。