jquery - オプションリスト項目の移動方法jqueryを使用していますか？

Question

これを移動するのに苦労しているので、謙虚に誰かに尋ねます（オプションリスト項目）：

<select class="list-of-users">
<option class="list-of-users">Sample Group</option>
<option class="list-of-users">TOP Group</option>
<option class="list-of-users">TEST Group</option>
<option class="list-of-users">AWD Group</option>
</select>

このリストに:

<ul class="list-of-members">
<li class="list-of-members"></li>
<li class="list-of-members"></li>
<li class="list-of-members"></li>
<li class="list-of-members"></li>
</ul>

今までぐるぐる回っています。前もって感謝します..

Answer 1

var ul = $("<ul/>").addClass("list-of-members");
$("option.list-of-users").each(function(){
   ul.append($("<li/>").html($(this).html()).addClass("list-of-members"));
});
$(".list-of-users").replaceWith(ul);

作業例: http://jsfiddle.net/z3uU3/1/

Answer 2

$('.list-of-users').on('change',function(){
  var value = $(this);

  $('ul.list-of-members').append('<li class="list-of-members">'+value.val()+'</li>')

});

これがあなたが望むものでない場合は、以下のリンクを参照してください

jqueryを使用して<select>ドロップダウンを順序付けされていないリストに変換する方法は?

Answer 3

試してみてください: フィドル

var ul = $("<ul/>").addClass("list-of-members");
$('body').append(ul);
$('.list-of-users option').each(function () {
    $('ul').append($("<li/>").text($(this).text()).addClass("list-of-members"));
});