Question

what I am trying to do is generate an html list based from another list on the page. I have a list along the lines of below:

<ul>
  <li class="chosen">content</li>
  <li class="something">content</li>
  <li class="something">content</li>
  <li class="something">content</li>
  <li class="something">content</li>
  <li class="chosen">content</li>
  <li class="chosen">content</li>
</ul>

Whats the best plan of action to create a jquery function which will find the list items with the class of “chosen” and create another list with just these.

Any help would be great. Thank you.

Answer 1

Select all the li elements with class chosen, clone and append into a new ul and finally append the ul to a container whereever you want or page body element.

$('<ul />').append($('ul li.chosen').clone()).appendTo(document.body);

Demo