<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Booking Form</title>
</head>
<body>
<div>Price: $65 USD / person</div>
<form action="" id="" method="post">
<div style="margin-top:8px;margin-bottom:8px">
<div style="margin-bottom:8px">
<label>
<div>Number of Participants</div>
</label>
</div>
<select id="selection" onchange="total()" name="">
<option value="1" selected="selected">1 guest</option>
<option value="2">2 guests</option>
<option value="3">3 guests</option>
<option value="4">4 guests</option>
<option value="5">5 guests</option>
<option value="6">6 guests</option>
<option value="7">7 guests</option>
<option value="8">8 guests</option>
<option value="9">9 guests</option>
<option value="10">10 guests</option>
</select>
</div>
<div style="margin-top:8px;margin-bottom:8px">
<div style="margin-bottom:8px">
<div>Choose a Date</div>
</div>
<input type="text" aria-label="Check In" id="startDate" name="startDate" value="" placeholder="Check In" autoComplete="off" />
</div>
<div style="margin-bottom:8px">
<div style="margin-bottom:8px">
<div>Choose a Time</div>
</div>
<select id="" name="">
<option selected="" value="1">8 am</option>
<option value="2">9 am</option>
<option value="3">10 am</option>
<option value="4">11 am</option>
<option value="5">1 pm</option>
<option value="6">2 pm</option>
<option value="7">3 pm</option>
</select>
</div>
<div style="margin-top:8px">
<div>Total Price: $<span id="result">65</span/> USD</div>
</div>
<div style="margin-top: 8px;">
<button>Book Now</button>
</div>
</form>
<script>
function total(){
let price = 65 ;
let val = document.getElementById("selection").value;
let result = Number(val) * price ;
document.getElementById("result").innerHTML = result;
}
</script>
</body>
</html>