jquery - 获取同级的总和

Question

我有

<div id="english">
   <ul>
        <li>English</li>
        <li>Instructor Name</li>
        <li class="grade">85</li>
   </ul>
</div>

<div id="math">
    <ul>
        <li>Math</li>
        <li>Instructor Name</li>
        <li class="grade">80</li>
    </ul>
</div>

<div id="science">
    <ul>
        <li>Science</li>
        <li>Instructor Name</li>
        <li class="grade">90</li>
    </ul>
</div>
<p id="grade-sum">Sum of grade here</p>

我的问题是如何使用 jquery 获得该类(class)成绩的总和。总和应为 255。

Answer 1

$(function() {
    var sum = 0;
    $('li.grade').each(function(){
        sum += parseInt(this.innerHTML, 10)
    })

    $('#grade-sum').text(sum);
})