JSFiddle - React, Tailwind, and code Playground

HTML

<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Customer Details</a></li>
        <li><a href="#tabs-2">Trip Details</a></li>
        <li><a href="#tabs-3">Trip Options</a></li>
    </ul>
    <form id='TripForm' action="dothebooking.php" method="POST">
        <div id="tabs-1">
            Customer Name: <input type='text' id="cn"><br>
            Customer Address: <input type='text' id="ca"><br>
            Customer Email: <input type='text' id="ce"><br>
            Customer Phone: <input type='text' id="cp"><br>
            <input id="cont1" type="button" value="Continue">
        </div><!-- #tabs-1 -->
        <div id="tabs-2">
            Departure Date: <input type='text' id="dd"><br>
            Return Date: <input type='text' id="rd"><br>
            <input id="cont2" type="button" value="Continue">
        </div><!-- #tabs-2 -->
        <div id="tabs-3">
            Guided Tour option <input type='checkbox' id="gt"><br>
            Presidential Suite <input type='checkbox' id="ps"><br>
            Bed and Breakfast <input type='checkbox' id="bb"><br>
            <input type='button' id="doit" value="Submit Trip"><br>
        </div><!-- #tabs-3 -->
    </form><!-- #TripForm -->
</div><!-- #tabs -->
<div id="theMsg"></div>

JavaScript

var arrFormFields = ['cn','ca','ce','cp','dd','rd'];

//jQueryUI init
$("#tabs").tabs(); //init the tabbed dialogs
$('#dd, #rd').datepicker(); //init the pop-up calendar
$("#theMsg").dialog({ //init the modal dialog, with an option
    autoOpen: false,
});

$('#doit').click(function() {
    for (var fld in arrFormFields) {
        if ( $('#' + arrFormFields[fld]).val() == ''){
            console.log('Var ' +arrFormFields[fld]+ ' has value: ' + $('#'+arrFormFields[fld]).val() );
            $('#' + arrFormFields[fld]).css({'border':'1px solid red','background':'yellow'})
            $('#ui-id-1').trigger('click');
            $('#' + arrFormFields[fld]).focus();
            alert('Please complete all fields'); //For some reason the alert isn't displaying
            return false;
        }else{
            //Submit form to "dothebooking.php", like this:
            //$('#TripForm').submit();
            $('#theMsg').html('<h2>Form was successfully submitted</h2>');
            $('#theMsg').dialog({'title':'Notice'}).dialog('open');
        }
    }
});

$('input:text').blur(function() {
    //Turn off any field coloring after validation
    $("input:not(:button)").css({'border':'1px solid grey','background':'white'});
});

$('#cont1').click(function() {
    $('#ui-id-2').trigger('click');
});
$('#cont2').click(function() {
    $('#ui-id-3').trigger('click');
});