Javascript-在对象数组上循环，只显示最后一个对象

我花了一点时间试图制作一个标题来解释这个问题，但我担心它与我现在的问题有点不符

简而言之，我使用for循环来迭代这个对象数组

var people = [
  {
      name: "John Doe",
      age: 33,
      gender: "male",
      loc: "Springfield"
   },
   {
      name: "Jane Doe",
      age: 32,
      gender: "female",
      loc: "Springfield"
   }
];

for循环通过传递两个参数的函数运行，一个是元素id，另一个是数组，如下所示

var list = {
  html: function (el, array) {
    var container = document.getElementById(el), html;    
    for( var i=0;i<array.length;i++ ) {
      html  = '<div class="item">';
      html +=   '<h1>'+array[i].name+'</h1>';
      html +=   '<p>Age: '+array[i].age+'</p>';
      html +=   '<p>Sex: '+array[i].gender+'</p>';
      html +=   '<p>Location: '+array[i].loc+'</p>';
      html += '</div>';     
      console.log( array[i].name+', '+array[i].age+', '+array[i].gender+', '+array[i].loc );  
    } 
    container.innerHTML = html; 
  } 
}
list.html('list', people); 

问题是：循环只返回数组中的最后一个对象。我不知道为什么会发生这种情况，也不知道如何解决。任何帮助都将不胜感激。多谢各位

下面是一个链接，指向一个：

Init html var，其中包含空字符串，并在for循环的开头添加+：

---

foor循环中的第一条指令是赋值

html  = '<div class="item">'

因此，在每次迭代中，html的全部内容都会被替换。 你应该使用

html += '<div class="item">';

---

还要确保在开始时使用html=。@u\u mulder，谢谢您的好意，先生。我真的很讨厌解决方案盯着我看。祝你今天愉快！非常感谢。我从来没有想过要替换变量的值。这样一个简单的错误，但很容易修复。祝您有个美好的一天。

html += '<div class="item">';