JSFiddle - React, Tailwind, and code Playground
HTML
<form id="namesForm">
<div id="nameRows">
<input type="button" onclick="javascript:;" id="addRow" value="Add Row"><br />
<input type="text" name="names[0][name]"><br />
</div>
<input type="submit" id="submit" value="Submit" />
</form>
JavaScript
jQuery(document).ready(function(){
var rows = 1;
jQuery('#addRow').click(function(){
jQuery('#nameRows').append('<div class="nameRow"><input type="text" name="names['+rows+'][name]" value="" /><a href="javascript:;" class="removeRow">Remove</a> name="names['+rows+'][name]"<div>');
rows++;
});
jQuery('.removeRow').live('click', function(){
jQuery(this).closest('.nameRow').remove();
});
// Below just used to show the string on submit
jQuery('#submit').click(function(e){
e.stopPropagation();
e.preventDefault();
alert(jQuery('#namesForm').serialize());
});
});