JSFiddle - React, Tailwind, and code Playground
HTML
<form id="booking-form" action="#" method="post">
<legend class="bold">Bookings</legend>
<div class="input clearfix required">
<label for="cinema">Cinema</label>
<select name="cinema" id="cinema">
<option value></option>
<option value="maxima" exceptitems="12,9">Cinema Maxima</option>
<option value="rivola">Cinema Rivola</option>
</select>
<div class="error">
<p>Please select a cinema</p>
</div>
</div>
<div class="input clearfix required">
<label for="day">Day</label>
<select name="day" id="day">
<option></option>
<option value="monday">Monday</option>
<option value="tuesday">Tuesday</option>
<option value="wednesday">Wednesday</option>
<option value="thursday">Thursday</option>
<option value="friday">Friday</option>
<option value="saturday">Saturday</option>
<option value="sunday">Sunday</option>
</select>
<div class="error">
<p>Please select a time</p>
</div>
</div>
<div class="input clearfix required">
<label for="time">Time</label>
<select name="time" id="time">
<option></option>
<option value="12" class="rivola">12pm</option>
<option value="3" class="maxima">3pm</option>
<option value="4" class="rivola">4pm</option>
<option value="6" class="maxima">6pm</option>
<option value="7" class="rivola">7pm</option>
<option value="9" class="maxima">9pm</option>
</select>
<div class="error">
<p>Please select a time</p>
</div>
</div>
<div class="input">
<input type="submit" value="Submit">
</div>
</form>
JavaScript
$(document).ready(function () {
$('#cinema').on('change', function (ev) {
$('#time option').hide();
$("." + this.value).show();
});
});