JSFiddle - React, Tailwind, and code Playground

by phoffman

HTML

<table id="passengersTable">
 <tbody>
<tr>
    <td><input type="text" /></td>
    <td><input type="button" value="delete" /></td>
</tr>
</tbody>
</table>

<input type="button" id="addPassenger" value="Add Passenger" />

JavaScript

$('#addPassenger').click(function() {
    var tr = document.createElement('tr');

    var td1 = document.createElement('td');
    var input = document.createElement('input');
    input.type = 'text';
    $(td1).append(input);

    var td2 = document.createElement('td');
    var button = document.createElement('input');
    button.type = 'button';
    button.value = 'delete';
    $(td2).append(button);

    $(tr).append(td1);
    $(tr).append(td2);
    $('#passengersTable tbody').append(tr);

})

$('#passengersTable td input[type=button]').live('click', function() {
    if (confirm("Are you sure you want to delete this passenger?")) $(this).closest('tr').remove();

});