jquery - 如何将具有相似属性的子级附加到父级？

Question

我有两个带有列表项的 UL，
它们具有相同的属性，例如 data-id。但是当页面加载时，它们不会附加到相同的 UL。

所以，我需要一些方法来正确移动它。 可能描述很奇怪，
示例:

<!-- HOW IT LOOKS AFTER PAGE LOAD -->
<ul data-id="first_ul">
   <li data-id="first_ul"></li>
   <li data-id="second_ul"></li>
   <li data-id="second_ul"></li>
</ul>

<ul data-id="second_ul">
   <li data-id="first_ul"></li>
   <li data-id="second_ul"></li>
   <li data-id="first_ul"></li>
</ul>

<!-- HOW IT SHOULD LOOKS AFTER SCRIPT'S WORK -->
<ul data-id="first_ul">
   <li data-id="first_ul"></li>
   <li data-id="first_ul"></li>
   <li data-id="first_ul"></li>
</ul>

<ul data-id="second_ul">
   <li data-id="second_ul"></li>
   <li data-id="second_ul"></li>
   <li data-id="second_ul"></li>
</ul>

感谢您的建议!

Answer 1

$('ul[data-id] li').each(function(){
   $(this).appendTo('ul[data-id="'+ this.dataset.id + '"]');
});

http://jsfiddle.net/3VAy6/