html - Need to move li content with jQuery -

i have multiple lists nested inside parent list; each child list resides in li class, while titles each nested list reside in adjacent li in parent list. markup follows:

<div>   <ul class="parent-list">     <li>nested list title 1</li>     <li class="child-list">       <ul class="bullets">         <li>list item</li>         <li>list item</li>         <li>list item</li>       </ul>     </li>     <li>nested list title 2</li>     <li class="child-list">       <ul class="bullets">         <li>list item</li>         <li>list item</li>         <li>list item</li>       </ul>     </li>     <li>nested list title 3</li>     <li class="child-list">       <ul class="bullets">         <li>list item</li>         <li>list item</li>         <li>list item</li>       </ul>     </li>   </ul> </div> 

what need move nested lists class "bullets" li elements adjacent respective parent li elements (e.g. first "bullets" list needs go first li "nested list title 1", second "bullets" list goes second li "nested list title 2", etc.).

after moving ul content, destroy li.child-list elements .remove().

i've been toying around .appendto() , .next/.prev functions, things aren't rendering out right. ideas?

tried take insights jquery insert html list before child ul-tag haven't gotten far.

you can find li children of parent ul not have child-list class , append next sibling li's ul like

$('.parent-list > li:not(.child-list)').append(function(){     return $(this).next('.child-list').remove().find('ul') }) 

demo: fiddle