javascript - リスト要素内の名前の重複をチェック

Question

質問：

リスト要素で重複した名前/アイテムをチェックするには?

私の状況：

リスト内にリストがあります。例を次に示します。

<ol class="sortable ui-sortable">
<li id="category_1"><div>Car</div>
   <ol>
       <li id="category_2"><div>Color</div>
            <ol>
                <li id="category_3"><div>Red</div></li>
                <li id="category_4"><div>Black</div></li>
            </ol>
       </li>
   </ol>
</li>
<li id="category_5"><div>Motor</div>
   <ol>
       <li id="category_6"><div>Red</div></li>
       <li id="category_7"><div>Black</div></li>
   </ol>
</li>
<li id="category_9"><div>Truck</div></li>
</ol>

使用class="sortable ui-sortable"されている はNestedSortable jQuery Plugin用です。したがって、リスト項目はドラッグ可能です。

div が別のリストにドラッグされたときに、それらの div 内の名前を確認したい<ol>。このリストに重複が含まれている場合は、赤で強調表示されます。

たとえば、すでに赤が含まれている-内にRed-category_6をドラッグすると、場所 (ドロップスポット) が赤くなります。ユーザーが引き続きその場所にドロップすると、リストは元の位置に戻ります。よりも下に移動されます。olColorcategory_2category_6olcategory_5

したがって、リストは次のようになるか、より良い方法があれば別のようになる可能性があります。

<ol class="sortable ui-sortable">
<li id="category_1"><div>Car</div>
   <ol>
       <li id="category_2"><div>Color</div>
            <ol>
                <li id="category_3"><div>Red</div></li>
                <li id="category_4"><div>Black</div></li>
                <li id="category_6" class="HIGHLIGHTED"><div>Red</div></li>
            </ol>
       </li>
   </ol>
</li>
<li id="category_5"><div>Motor</div>
   <ol>
       <li id="category_7"><div>Black</div></li>
   </ol>
</li>
<li id="category_9"><div>Truck</div></li>
</ol>