A bit of javascript to add arbitrary elements to a list (in this case of input elements for an array)

addElements.js

 	<script>
 	(function($) {

 		$(document).ready(function (){

 	 		// here we can add <li><button class="addNewSiblingField">Add New</button></li>, and it will auto setup a list to add and remove arbitrary elements 	 		
 			$('.addNewSiblingField').closest('ul').addClass('addNewSiblingsList');
 			$('.addNewSiblingField').parent().siblings().append('<button class="removeSiblingField">Remove</button>');
 			$('.addNewSiblingsList').on('click', '.addNewSiblingField', function(e){
 	 			var newField = "";
 	 			e.preventDefault();
 	 			newField = $(this).parent().prev().clone();
 	 			$('input', newField).val('');
 	 			$(this).parent().before(newField);
 	 		});
			// and this sets up the "delete" function:		
 			$('.addNewSiblingsList').on('click', '.removeSiblingField', function(e){
 	 			$(this).parent().remove();
 	 		});
			
 		});
 		
 	})(jQuery);	
 	</script>