0

I humbly ask anyone because I'm having trouble moving this (option list items):

<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>

to this list:

<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>

I'm running in circles up until now. Thank you in advance..

JayP
  • 39
  • 4
  • what do you mean by 'moving'? do you want a select block appended to the ul or do you want the text from each option created as a new li – olly_uk Mar 06 '13 at 12:14
  • Edit the question and add your code you have tried to achieve that. – Rais Alam Mar 06 '13 at 12:14
  • possible duplicate of [How to convert – Dipesh Parmar Mar 06 '13 at 12:19

4 Answers4

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

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

});

if this is not what you want the see below link

How to convert <select> dropdown into an unordered list using jquery?

Community
  • 1
  • 1
Dipesh Parmar
  • 26,601
  • 7
  • 57
  • 86
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);

Working Example: http://jsfiddle.net/z3uU3/1/

Kevin Bowersox
  • 90,944
  • 18
  • 150
  • 184
0

Try this,

Live Demo

strToAppend = "";
$('option.list-of-users').each(function () {
    strToAppend += "<li>" + $(this).text() + "</li>";
});

$('ul.list-of-members').append(strToAppend);
Adil
  • 143,427
  • 25
  • 201
  • 198
0

Try: Fiddle

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"));
});
Anujith
  • 9,319
  • 6
  • 32
  • 47