html - sorting divs by id on two levels using jQuery -

i looked through sorting jquery, need sort in two levels.

sorting both levels, top , child levels alphabethically

my simple html structure this:

<div id="contentobjects"> <div id="blue" class="sort1">   <div>     blue   </div>    <div id="triangle" class="blue_sort2">     <h3>triangle</h3>      <div>       internalname: b_triangle     </div>      <div>       displayname: blue triangle     </div>      <div>       size: 2     </div>   </div>    <div id="ball" class="blue_sort2">     <h3>ball</h3>      <div>       internalname: b_ball     </div>      <div>       displayname: blue ball     </div>      <div>       size: 5     </div>   </div> </div>  <div id="red" class="sort1">   <div>     red   </div>    <div id="cube" class="red_sort2">     <h3>cube</h3>      <div>       internalname: r_cube     </div>      <div>       displayname: red cube     </div>      <div>       size: 5     </div>   </div> </div> 

after document ready execute javascript:

function sortall() {     var arrayofclassids = $.map($(".sort1"), function(n, i){               return n.id;             });     var arrayofsubclassids;      console.log(arrayofclassids);     $.each($('.sort1'), function() {         var _id = $(this).attr('id');         var _parent = $(this);         arrayofsubclassids = $.map($("."+_id+"_sort2"), function(n, i){               return n.id;             });              var arrayofsortedsubclassids = arrayofsubclassids.sort();             console.log(arrayofsortedsubclassids);             // start sorting second level              $.each(arrayofsortedsubclassids, function(i, v) {                 console.log("appending "+v+" "+_parent.attr('id'))                 // element id v , append parent                 $(v).appendto(_parent);             });     }); } 

on console log looks good:

["blue", "red"] ["ball", "triangle"] appending ball blue appending triangle blue ["cube"] appending cube red  

so expected there is

blue ball , triangle, red cube. 

but result

blue triangle , ball, red cube. 

please point me mistake. thanks!

on last loop, iterating on id's , trying append ids whereas should append dom elements id's

try

 $('#' + v).appendto(_parent); 

see working fiddle