Group by matching data id and order by another data attribute

Is it possible to group a number of divs by matching data-id and order it by another data attribute. Can this be done with underscorejs or plain javascript?

Thanks

Current layout of div

<div id="parentID">
  <div data-id="71" data-orderby="2" class="child">ID: 71 Order 2</div>
  <div data-id="71" data-orderby="3" class="child">ID: 71 Order 3</div>
  <div data-id="71" data-orderby="1" class="child">ID: 71 Order 1</div>
  <div data-id="62" data-orderby="2" class="child">ID: 62 Order 2</div>
  <div data-id="62" data-orderby="1" class="child">ID: 62 Order 1</div>
  <div data-id="59" data-orderby="1" class="child">ID: 59 Order 1</div>
  <div data-id="59" data-orderby="3" class="child">ID: 59 Order 3</div>
  <div data-id="59" data-orderby="2" class="child">ID: 59 Order 2</div>
</div>

Desired output

<div id="parentID">
  <div data-id="71" data-orderby="1" class="child">ID: 71 Order 1</div>
  <div data-id="71" data-orderby="2" class="child">ID: 71 Order 2</div>
  <div data-id="71" data-orderby="3" class="child">ID: 71 Order 3</div>
  <div data-id="62" data-orderby="1" class="child">ID: 62 Order 1</div>
  <div data-id="62" data-orderby="2" class="child">ID: 62 Order 2</div>
  <div data-id="59" data-orderby="1" class="child">ID: 59 Order 1</div>
  <div data-id="59" data-orderby="2" class="child">ID: 59 Order 2</div>
  <div data-id="59" data-orderby="3" class="child">ID: 59 Order 3</div>
</div>

41 thoughts on “Group by matching data id and order by another data attribute”

Leave a Comment