JSFiddle - React, Tailwind, and code Playground

by Godin1

HTML

<table align="center" class="table table-bordered" style="border-radius: 15px;">
    <col width="350">
        <col width="600">
            <col width="150">
                <tr>
                    <th>Destination</th>
                    <th>Description</th>
                    <th>Price</th>
                </tr>
                <tr>
                    <td>Villa Jibacoa
                        <br>
                    </td>
                    <td>
                        <ul>
                            <li>255 rooms</li>
                            <li>One 9-storey building</li>
                            <li>4 restaurants</li>
                            <li>5 bars</li>
                            <li>Pool</li>
                            <li>110 and 220 volts (adaptor required)</li>
                        </ul>
                    </td>
                    <td>$784
                        <div style="position: relative; margin-top: 40px;">
                            <button id="first" type="button" onclick="SeatAssignment()" class="btn btn-success">Book Now!</button>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td>Gran Caribe Puntarena
                        <br>
                    </td>
                    <td>
                        <ul>
                            <li>110 rooms</li>
                            <li>Bungalow-style villas</li>
                            <li>2 restaurants</li>
                            <li>2 bars</li>
                            <li>Pools</li>
                            <li>220 volts (adaptor required)</li>
                        </ul>
                    </td>
                    <td>$947
                        <div style="position: relative; margin-top: 40px;">
                            <button type="button" onclick="SeatAssignment()" class="btn btn-success">Book Now!</button>
                        </div>
                   ...

JavaScript

var SeatSection;
var seats = (11);
var firstClass = 1;
var economy = 6;
var seatselection;

seats = 0;

SeatAssignment = function() {
            seatselection = window.prompt("Please select 1 for firstclass and 2 for economy");

            if (seatselection == 1 && firstClass <=5 && seats == 0)
                {
                    
                    window.alert("You have been assigned first class seat #" + firstClass);
                    seats[firstClass] = 1;
                    ++ firstClass;                                    
                }
            else if (seatselection == 2 && economy <=10 && seats == 0)
            {
                window.alert("You have been assigned economy class seat #" + economy);
                    seats[economy] = 1;
                    ++ economy; 
            }

            else 
            {
                window.alert("Seats are full");
            }
                    
                
}