View All Products With The Replicate Of The List Of Products Presented In Html In Un Click Jquery

I've this code https://jsfiddle.net/oj20rwk3/ The goal is to create a 'View all' button under the product sheets which, when clicked, adds clones of the latter at the bottom of the

Solution 1:

You would need a wrapped element for all your product-item so that we can easily clone its children with matching class name and append to the wrapper.

let cloned = false;
$('button[name=viewALL]').click(function(){

  /* Below check is to prevent cloning more than once */if (cloned === false ) { 
    cloned = true;
    $(".product-wrapper").children('.product-item').clone().appendTo(".product-wrapper");
  }
});

<divclass="product-wrapper"><divclass="product-item">.A.</div><divclass="product-item">.B.</div><divclass="product-item">.C.</div></div>

Jsfiddle - https://jsfiddle.net/kaop69zg/