将选定的li添加到现有ul

时间:2015-11-05 09:16:35

标签: javascript jquery

我有一个元素列表li

<ol class="selectable" id="firstList">
    <li class="ui-widget-content"> text 1</li>
    <li class="ui-widget-content"> text 2</li>
    <li class="ui-widget-content"> text 3</li>
</ol>

我想在第一个列表中选择int中的一个或多个元素时,应将这些选定的元素添加到另一个列表<ol>

<ol class="selectable" id="result">

</ol>

1 个答案:

答案 0 :(得分:4)

只需你可以做这样的事情

$('#firstList li').click(function() {
// click event handler for listening click event
  $(this).toggleClass('selected');
  // toggling selected class class
  $('#result').html($('#firstList .selected').clone())
  // updating result list with selected list item ( li which have selected class )
  // use `.removeClass('selected')` if you want to remove selected class from clone
})
#firstList .selected {
  color: red;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<ol class="selectable" id="firstList">
  <li class="ui-widget-content">text 1</li>
  <li class="ui-widget-content">text 2</li>
  <li class="ui-widget-content">text 3</li>
</ol>
<ol class="selectable" id="result">
</ol>