CodePen

HTML

            
              <button>Clone / Duplicate</button>

<ul>
  <li>
    <h1>Heading tag</h1>
    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Eius voluptatem maxime voluptatibus dicta modi repellendus neque placeat porro libero nihil saepe sequi repellat! Fugiat illum dignissimos doloribus velit dicta commodi.</p>
  </li>
</ul>
            
          
!

↑ Insert the most common viewport meta tag

CSS

            
              button {
  height:60px;
  width:200px;
  position:relative;
  margin:10px auto 0;
  display:block;
  font:normal normal 20px sans-serif;
}
li {
  float:left;
  margin:20px;
  height:100%;
  width:200px;
  border:1px solid #aaa;
  box-sizing:border-box;
  padding:10px;
}
li:first-of-type {
  display:none;
}
p {
  margin:6px 0;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              $.fn.duplicate = function(count, cloneEvents) {
  var tmp = [];
  for ( var i = 0; i < count; i++ ) {
    $.merge( tmp, this.clone( cloneEvents ).get() );
  }
  return this.pushStack( tmp );
};

$('li').click(function() {
  alert(this.nodeName + ': #' + $('li').length);
});

$('button').click(function() {
  $('li').first().duplicate(1, true).appendTo('ul');
});
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................