Сравните divs(класс) в родителях и, если не хватает, добавьте их в нужное место javascript

Question

Нужна помощь в поиске и добавлении алгоритма кода Javascript для сравнения divs(классов) в родителях и, если он отсутствует, добавьте их в нужное место...

<div class="score">
  <div class="system">
    <div class="stff_Flute"></div>
    <div class="stff_Timpani"></div>
  </div>
  <div class="system">
    <div class="stff_Flute"></div>
  </div>
  <div class="system">
    <div class="stff_Timpani"></div>
  </div>
  <div class="system">
    <div class="stff_Flute"></div>
    <div class="stff_Timpani"></div>
  </div>
</div>

чтобы...

<div class="score">
  <div class="system">
    <div class="stff_Flute"></div>
    <div class="stff_Timpani"></div>
  </div>
  <div class="system">
    <div class="stff_Flute"></div>
    <div class="stff_Timpani"></div>
  </div>
  <div class="system">
    <div class="stff_Flute"></div>
    <div class="stff_Timpani"></div>
  </div>
  <div class="system">
    <div class="stff_Flute"></div>
    <div class="stff_Timpani"></div>
  </div>
</div>

Может быть, это способ сравнения массивов, но я не могу понять.. https://jsfiddle.net/e5b1gots/8/

Answer 1

Я решил эту проблему:)

//--- find all instrument ---//

function compareArrays(a, b) {
    return !a.some(function (e, i) {
        return e != b[i];
    });
}
var a = [];
$('.system > div').each(function(){
    var all_instruments = $(this).attr('class');
    a.push(all_instruments);
});
var filter = function(value, index){ return this.indexOf(value) == index };
var filteredData = a.filter(filter, a );
var a = filteredData;
console.log(a);
$('.score > div').each(function(){
    b = [];
    $("> div",this).each(function(){ 
    var all_instruments2 = $(this).attr('class'); 
    b.push(all_instruments2)
});

//--- add missing instrument ---//

c = a.filter(function(val) {
  return b.indexOf(val) == -1;
});
for (i = 0; i < a.length; i++) {
  c = c.sort(a);
  $('<div class="'+ (c[i]) +'">'+ (c[i]) +'</div>').appendTo(this);
  $(".undefined").remove();
}
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div class="score">
  <div class="system">
    <div class="stff_Flute">stff_Flute</div>
    <div class="stff_Timpani">stff_Timpani</div>
  </div>
  <div class="system">
    <div class="stff_Flute">stff_Flute</div>
  </div>
  <div class="system">
  <div class="stff_Oboe">stff_Oboe</div>
    <div class="stff_Timpani">stff_Timpani</div>
  </div>
  <div class="system">
    <div class="stff_Flute">stff_Flute</div>
    <div class="stff_Oboe">stff_Oboe</div>
    <div class="stff_Timpani">stff_Timpani</div>
  </div>
</div>