JSFiddle - React, Tailwind, and code Playground

by Skooljester

HTML

<button id="add" value="add">Add More</button>
<button id="finished" value="finished">Finished</button>
<div id="test">Hello Kitty</div>

JavaScript

function createCells(dest, array) {
    for (i=0; i< array.length; i++) {
        dest += '<td>'+ array[i] +'</td>'; 
    }
    return '<tr>'+dest+'</tr>';
}
function createArray(array) {
    $('input').each(function(index, item) {
        array[index] = $(item).val();
    });
    return array;
}
function testAdd() {
    $('body').append(nameInput,ageInput);
}
var nameInput = ('<input type="text" value="name" />');
var ageInput = ('<input type="text" value="age" />');
var baseVals = [];
var headerCells = '';
testAdd();
createArray(baseVals);
$("#add").on("click", function(event){
    //$('body').append('<input type="text" value="name" />');
    testAdd();
});

$('#finished').click(function() {
    var inputVals = [];
    createArray(inputVals);
    alert(inputVals);
    var dataCells = '';
    var table = $('<table id="results">'+createCells(headerCells, baseVals)+createCells(dataCells, inputVals));
    $('#results').remove();
    table.appendTo('body');
});