jquerydomdom-nodejquery-clone

Jquery clone doesnt copy all html


Please advise how to make jquery below clone the full line, at the moment only "3" is inserted.

I would like the following inserted e.g

 <div class="servline_vhc servline_vhc_inspection clearfix">3</div>

jquery:

var $clone = $('div.servline_vhc.servline_vhc_inspection.clearfix').last().clone(true);
$clone.insertAfter($('div.servline_vhc.servline_vhc_inspection.clearfix').last()); 

html:

<div class="servline_vhc servline_vhc_inspection clearfix">1</div>
<div class="servline_vhc servline_vhc_inspection clearfix">2</div>
<div class="servline_vhc servline_vhc_inspection clearfix">3</div>

Solution

  • If I've understood right that's what you want, check the console in the working example below:

    $(document).ready(function(){
      
      // Setting the clone
      var $clone =   $('div.servline_vhc.servline_vhc_inspection.clearfix').last().clone(true);
      
      // This already saves the last element node like you want
     $clone.insertAfter($('div.servline_vhc.servline_vhc_inspection.clearfix').last()); 
      
      // Check the console, that's the element DOM node HTML
      console.log($clone[0]);
    });
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div class="servline_vhc servline_vhc_inspection clearfix">1</div>
    <div class="servline_vhc servline_vhc_inspection clearfix">2</div>
    <div class="servline_vhc servline_vhc_inspection clearfix">3</div>

    If you just want the element, remind about the use of ".insertAfter()".

    Some links from jQuery's offical documentation:

    http://api.jquery.com/insertAfter/

    http://api.jquery.com/clone/