Link jQuery Cloner

	
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
		<script src="jquery-cloner/dist/jquery-cloner.min.js"></script>
	
	

Write the Markup (this is using default classes used by jQuery Cloner)

	
		<div class="clonable-block" data-toggle="cloner">
			<div class="clonable">
				<label>Attributes</label>
				<input type="text" name="attr[]">
				<button type="button" class="clonable-close-button">Delete</button>
				<br>
				<br>
			</div>
			<br>
			<button type="button" class="clonable-button-add">Add Attributes</button>

		</div>
	
	

Note: The data-toggle="cloner" is the default attribute to initialize the plugin

Here's the Result



Here's the default options and events for the plugin
	$('.my-clonable').clonable({
	clonableContainer: '.clonable-block',
    clonable: '.clonable',
    addButton: '.clonable-button-add',
    closeButton: '.clonable-button-close',
	repeatableContainer: '.repeatable-block',
    repeatable: '.repeatable',
    addButton: '.repeatable-button-add',
    closeButton: '.repeatable-close-button',
    focusableElement: 'input:first',
    clearValueOnClone: true,
    debug: false,

    beforeToggle: function (clone, index, self) {},
    afterToggle: function (clone, index, self) {}
});