Javascript jquery中的每个函数都不循环

我有一个使用django的具有以下值的表

<tr>
    <td>Chips</td>
    <td>2</td>
    <td>20.00</td>
    <td id='totalperitem'>40.00</td>
</tr>

<tr>
    <td>pizza</td>
    <td>2</td>
    <td>100.00</td>
    <td id='totalperitem'>200.00</td>
</tr>

<tr>
    <td>Peanut Butter</td>
    <td>2</td>
    <td>50.00</td>
    <td id='totalperitem'>100.00</td>
</tr>

这是我在控制台中得到的输出

sum : 40

我做错了什么

谢谢，

---

KJ

一页中不允许有多个ID相同的元素

---

使用

class

而不是

id

<td class='totalperitem'>200.00</td>

---

使用

class

而不是

id

并执行

var sum = $('.totalperitem').get().reduce(function(a,b){
  return a + parseFloat(b.innerHTML);
},0);

---

id

属性必须是唯一的。它是一个标识符，因此用于标识单独的元素。Id应该是唯一的！给他们上课

var running_total = 0;
$('.totalperitem').each(function(){
    running_total += parseInt($(this).text());
    console.log('sum : ' + running_total);
});

var sum = $('.totalperitem').get().reduce(function(a,b){
  return a + parseFloat(b.innerHTML);
},0);