将一个jQuery应用于多个span元素

Question

大家好！ 我试图在不同类的多个进度条饼上应用一个jQuery，但似乎无法管理。非常感谢帮助！

<div class='zarade'>
    <span class="chart" data-percent="30"><span class="percent"></span></span>
    <span class="chart" data-percent="60"><span class="percent"></span></span>
    <span class="chart" data-percent="80"><span class="percent"></span></span>
    <span class="chart" data-percent="130"><span class="percent"></span></span>

</div>

这是.js部分：

<script src="js/easypiechart.js"></script>
<script>
document.addEventListener ('DOMContentLoaded', function() {
    var chart = window.chart = new EasyPieChart(document.querySelector (".chart"), {
        easing: 'easeOutElastic',
        delay: 5000,
        size: 150,
        barColor: '#F30',
        trackColor: '#CCC',
        scaleColor: false,
        lineWidth: 6,
        trackWidth: 4,
        lineCap: 'butt',
        onStep: function(from, to, percent) {
            this.el.children[0].innerHTML = Math.round(percent);
        }
    });

    document.querySelector('.js_update').addEventListener('click', function(e) {
        chart.update(Math.random()*200-100);
    });

});
</script>