Show total of data attributes based on different data attribute name

Show total of data attributes based on different data attribute name

The title probably doesn't explained what I'm trying do very well .

I have the code below output and what I'd like to do is total all the data-distance arrtibutes where the data-team name is the same.

So using the code below I'd have 3 totals, one for admin, one for stores and one for sales.
  1. <div class="team">
    <div class="hours" data-team="admin" data-distance="1.77"></div>
    <div class="hours" data-team="admin" data-distance="9.375"></div>
    <div class="hours" data-team="admin" data-distance="6.3"></div>
    <div class="hours" data-team="admin" data-distance="5.625"></div>
    <div class="hours" data-team="admin" data-distance="5.31"></div>
    </div>
    admin team total
    <div class="team">
    <div class="hours" data-team="stores" data-distance="0.75"></div>
    <div class="hours" data-team="stores" data-distance="9.375"></div>
    <div class="hours" data-team="stores" data-distance="6.3"></div>
    <div class="hours" data-team="stores" data-distance="9.375"></div>
    </div>
    stores team total
    <div class="team">
    <div class="hours" data-team="sales" data-distance="0.75"></div>
    <div class="hours" data-team="sales" data-distance="0.75"></div>
    <div class="hours" data-team="sales" data-distance="5.25"></div>
    <div class="hours" data-team="sales" data-distance="6.3"></div>
    </div>
    sales team total
Hope this makes sense and someone can help me with this.

Thanks

Wayne.