JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="https://cdn.datatables.net/v/dt/dt-1.10.20/datatables.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.24.0/moment.min.js"></script>
<script src="https://cdn.datatables.net/v/dt/dt-1.10.20/datatables.min.js"></script>
    <div>
        <span>Date Format: &nbsp;</span>
        <select id="ddlDate">
            <option value="DD/MMM/YYYY">DD/MMM/YYYY</option>
            <option value="DD/MM/YYYY">DD/MM/YYYY</option>
            <option value="MM/DD/YYYY">MM/DD/YYYY</option>
        </select>
    </div>
    <br />
    <div>
        <span>Date Format: &nbsp;</span>
        <select id="ddlTime">
            <option value="HH:mm:ss">24-Hour</option>
            <option value="hh:mm:ss A">12-Hour</option>
        </select>
    </div>
    <br />
    <table id="myTable">
    </table>
    <br />

<textarea id="console" style="width: 100%;height:100px;">
	
</textarea>

CSS

body {
    background: #FFFFFF;
    padding: 20px;
    font-family: Helvetica;
}

JavaScript

var dtFormat = 'DD/MMM/YYYY';
var tmFormat = 'HH:mm:ss'

$('#ddlDate').on('change', function() {
    dtFormat = $(this).children('option:selected').val();
	$('#console').html($('#console').html() + dtFormat + '\r\n');
});

$('#ddlTime').on('change', function() {
    tmFormat = $(this).children('option:selected').val();
	$('#console').html($('#console').html() + tmFormat + '\r\n');
});

var myData = [
    [
        "SP1",
        "2019-10-18T07:28:30",
        "2019-10-18T12:06:32",
    ],
    [
        "SP1",
        "2019-10-16T19:17:50",
        "2019-10-16T15:17:50",
    ],
    [
        "SP2",
        "2019-10-16T18:31:19",
        "2019-10-16T17:31:19",
    ]
]

$('#myTable').DataTable({
    destroy: true,
    data: myData,
    info: false,
    paging: false,
    columnDefs: [{
        targets: [1, 2],
        render: function(data) {
            return moment(data).format(dtFormat + ' ' + tmFormat);
        },
        type: "date",
    }],
    columns: [{
        title: 'Name'
    }, {
        title: 'Start Time'
    }, {
        title: 'End Time'
    }]
});