jquery - Drop item from one sortable list to another -

i have 2 sortable lists not connected each other:

<ul id="list1">     <li>item1</li>     <li>item2</li>     <li>item3</li> </ul> <ul id="list2">     <li>container 1</li>     <li>container 2</li>     <li>container 3</li> </ul> 

jquery:

$("#list1").sortable({     items: "li",     distance: 25,     out: function (event, ui) {},     over: function (event, ui) {},     stop: function (event, ui) {} });  $("#list2").sortable({     items: "li",     distance: 25,     out: function (event, ui) {},     over: function (event, ui) {},     stop: function (event, ui) {} }); 

how can make possible drop item of first list item of second one, , 1 dropped , dropped?

live jsfiddle

edit:i want create relation between elements of first list second. if user drags item first list , drops item of second list, should 1 relation (e.g. item1 - container1) , item1 should place.

use following. working fine me

$("#list1").sortable({     connectwith: '#list2' }); $("#list2").sortable({     connectwith: '#list1' });