JSFiddle - React, Tailwind, and code Playground

HTML

<input id="number" type="text" />
<button id="submitid">Submit</button>
<table id="datatable" style="display:none">
    <colgroup>
        <col>
            <col>
                <col>
                    <col>
                        <col>
                            <col>
                                <col>
                                    <col>
    </colgroup>
    <thead>
        <tr>
            <th rowspan="1" colspan="1">
                <div> <span><a href="#" title="">Format</a></span>

                </div>
            </th>
            <th rowspan="1" colspan="1">
                <div> <span><a href="#" title="">Title</a></span>

                </div>
            </th>
            <th rowspan="1" colspan="1">
                <div> <span><a href="#" title="">Number</a></span>

                </div>
            </th>
            <th rowspan="1" colspan="1">
                <div> <span><a href="#" title="">Code</a></span>

                </div>
            </th>
            <th rowspan="1" colspan="1">
                <div> <span><a href="#" title="">Checkout Date</a></span>

                </div>
            </th>
            <th rowspan="1" colspan="1">
                <div> <span><a href="#" title="">Due Date</a></span>

                </div>
            </th>
        </tr>
    </thead>
</table>
<button id="continue" style="display:none;">Continue</button>
<table id="seconddatatable">
    <colgroup>
        <col>
            <col>
                <col>
                    <col>
                        <col>
                            <col>
                                <col>
                                    <col>
    </colgroup>
    <thead>
        <tr>
            <th rowspan="1" colspan="1">
                <div> <span><a href="#" title="">Format</a></span>

                </div>
            </th>
            <th rowspan="1" colspan="1">
                <div> <span><a href="#" title="">Title</a></span>

                </div>
       ...

JavaScript

// json data object
var data = JSON.parse('{ "122233334444": ["Book","Three Musketters","DE7598490587","7584092043857", "03/18/13 11:17:51 AM","03/18/13 11:17:51 AM" ], "122223355552":["Book","Two Musketters","DE7598490587","7584092043857", "03/18/13 11:17:51 AM","03/18/13 11:17:51 AM" ] }');
$("#submitid").click(function () {
    $("#continue").show();
    var rowId = $("#number").val();
    var rowData = data[rowId];
    if (rowData) {
        $('#datatable').find('tr').eq(1).remove().appendTo($('#seconddatatable'));
        
        var tr = $("<tr></tr>").attr("id", "datatable-row-" + rowId);
        for (var col = 0; col < rowData.length; col++)
        tr.append($("<td></td>").text(rowData[col]));
        $("#datatable").append(tr);
        $("#datatable").show();
    } else {
        alert("Row doesn't exist in json object: " + rowId);
    }
});