Clone Div into another DIV

Question

I am trying to clone a DIV to prevent data reputation; this is a frequent thing I want to do over various pages so I don't want to make bug structural changes.

I would like to Clone mApageLeft with the class maContent, and all of its inner div's and content into another div named cloneContent.

I have looked at other examples of Clone, and my attempt does not show anything. Thanks in advance for any help.

<div>
  <div>
    <div>
           <div id="mApageLeft" name="mApageLeft" class="maContent">
                  <div> header and some text here
                  </div>
                  <div>  text and image here
                  </div>
                  <div>  text and another image here
                  </div>
           </div>
     </div>
   </div>
</div>

<div id="mobileArea">
<div id="mobileMainArea">
    headers, links and sme text
            <div name="cloneContent" id="cloneContent" class="maContent"></div>
            <script>
            $(function(){
                var $mainAreaClone = $('#mApageLeft').clone();
                $('#cloneContent').html($mainAreaClone);
            });
            </script>
</div>
</div>

Answer 1

Your code works fine when I test it on fiddle. Even after that, if you wanna try something else, you can try append() instead of html() function. Usually when you clone, you want to append the cloned object, you don't want to put is as inner HTML. However, that will also work.