同じ親でdivsを変数classNameと組み合わせるにはどうすればよいですか？

Question

divsを同じ親（フルート、ピッコロ...）に組み合わせる必要がありますが、これらのクラス名は可変です。私は多くの方法を試みたが成功しなかった。

https://jsfiddle.net/3hm7ngk7/1/

<div class="score"> 
     <div class="Flute"> 
     <div class="item">item 1</div> 
     <div class="item">item 2</div> 
     </div> 
     <div class="Piccolo"> 
     <div class="item">item 3</div> 
     <div class="item">item 4</div> 
     </div> 
     <div class="Flute"> 
     <div class="item">item 5</div> 
     <div class="item">item 6</div> 
     </div> 
     <div class="Piccolo"> 
     <div class="item">item 7</div> 
     <div class="item">item 8</div> 
     </div> 
     <div class="Clarinet_in_Bb"> 
     <div class="item">item 9</div> 
     <div class="item">item 10</div> 
     </div> 
    </div> 

<div class="score"> 
<div class="Flute"> 
    <div class="item">item 1</div> 
    <div class="item">item 2</div> 
    <div class="item">item 5</div> 
    <div class="item">item 6</div> 
    </div> 
    <div class="Piccolo"> 
    <div class="item">item 3</div> 
    <div class="item">item 4</div> 
    <div class="item">item 7</div> 
    <div class="item">item 8</div> 
    </div> 
    <div class="Clarinet in Bb"> 
    <div class="item">item 9</div> 
    <div class="item">item 10</div> 
    </div> 
</div> 

Answer 1

あなたのコードが動作しているが、それは動的ではありません、私はクラスscoreのすべての直接の子を通過する各機能を使用して更新、動的にクラスを組み合わせているはずです同じ名前で

$('.score').children('div').eachが.score

内のそれぞれの子によって読み書きされますが、あなたが

$('.score').children('div').each(function(i, obj) { 
 
    let rows = $('.' + obj.className); 
 
    rows.first().append(rows.not(':first', this).children()) 
 
    rows.not(':first').remove(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="score"> 
 
    <div class="Flute"> 
 
    <div class="item">item 1</div> 
 
    <div class="item">item 2</div> 
 
    </div> 
 
    <div class="Piccolo"> 
 
    <div class="item">item 3</div> 
 
    <div class="item">item 4</div> 
 
    </div> 
 
    <div class="Flute"> 
 
    <div class="item">item 5</div> 
 
    <div class="item">item 6</div> 
 
    </div> 
 
    <div class="Piccolo"> 
 
    <div class="item">item 7</div> 
 
    <div class="item">item 8</div> 
 
    </div> 
 
    <div class="Clarinet in Bb"> 
 
    <div class="item">item 9</div> 
 
    <div class="item">item 10</div> 
 
    </div> 
 
</div>