Question: I have below html code

```
<ul id="sortable1" class="connectedSortable">
    <li class="ui-state-default">Item 1</li>
    <li class="ui-state-default">Item 2</li>
    <li class="ui-state-default">Item 3</li>
    <li class="ui-state-default">Item 4</li>
    <li class="ui-state-default">Item 5</li>
</ul>
<ul id="sortable2" class="connectedSortable">
</ul>

```

And script

```
$(function() {      
    $( "#sortable1, #sortable2" ).sortable({
        connectWith: ".connectedSortable"
    }).disableSelection();
});

```

I am new to sortable. Can any one please help me to move all li from sortable1 to sortable2 using script. Means I want to create MoveAll button which can move all the li from sortable1 to sortable2

Answer: 
Simply append li items to other list:

```
$('#sortable1 li').appendTo('#sortable2');

```

### Demo: <http://jsfiddle.net/3z0e6q9m/>
It's quite simple:

```js
$(function() { 
    $("#moveAll").on("click", function(e) { 
        $("#sortable2").append($("#sortable1 li"));
    });
});
```

```html
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<h1>Sortable1</h1>
<ul id="sortable1" class="connectedSortable">
    <li class="ui-state-default">Item 1</li>
    <li class="ui-state-default">Item 2</li>
    <li class="ui-state-default">Item 3</li>
    <li class="ui-state-default">Item 4</li>
    <li class="ui-state-default">Item 5</li>
</ul>
<h1>Sortable2</h1>
<ul id="sortable2" class="connectedSortable">
</ul>
<button id="moveAll">Move All</button>
```