Add additional (removable) fields to HTML form when user tabs out of last field (jQuery).

DynamicallyExpandingForm.js

/* Created by Hersh Bhargava of H2 Micro (www.h2micro.com) */

//Keep track of dynamically added text inputs in 'i'
var i = $('#items p').size() + 1;
//Keyup function to add text input on tab release from last field
$(document).on('keyup', 'input[type="text"]:last', function (e) {
    //check if the released key was the tab key
    if (e.which == 9) {
        //append additional fields to items div
        var targetDiv = $('#items');
        //include the desired html here, with a #remove id on the element that should remove the fields.
        $('YOUR_HTML_CONTENT').appendTo(targetDiv);
        i++;
        return false;
    }
});
//Remove set on inputs closest to clicked remove button
$(document).on('click', '#remove', function () {
    if (i > 1) {
        $(this).closest('YOUR_CONTAINING_ELEMENT').remove();
       i--;
    }
    return false;
});