jquery - jquery を使用してサブメニューを新しい div に配置する

Question

サブメニューのあるメニューがあります。jquery を使用して、すべてのサブメニュー (順序付けされていないリスト) を展開する div に移動したいと考えています。たとえば、次のようなメニューがあります。

<ul id="menu">
    <li>
        <ul class="sub-menu">...</ul>
    </li>
    <li>
        <ul class="sub-menu">...</ul>
    </li>
    <li>
        <ul class="sub-menu">...</ul>
    </li>
</ul>

そして、各 .sub-menu を下の div に移動したいと思います。現在、.sub-menu を 1 つだけ取得できます。

var put = jQuery( ".sub-menu").html();
jQuery('#nav-expand').html(put);

しかし、私はそれぞれを取得したいと思います。.each() を使用してみましたが、間違って使用しているか、別の解決策が必要です。