JSFiddle - React, Tailwind, and code Playground
HTML
<form id="cityfibre_form" action="cityfibre_data.html" method="get" onsubmit="return validate(this);" target="_blank" > <!--onsubmit="mySubmit()" onreset="myReset()"-->
<div id="Page1"> <!--SURVEY FORM PAGE 1 action="cityfibre_data.html"-->
<h2 class="property">Property information</h2>
<fieldset>
<figure class="property_information">
<figure class="fig">
<label>
<div class="order">A</div>
<p>Proposed Cable Route<span class="asterisk">*</span></p>
</label>
<br>
<select name="proposed_cable_route" id="cf_proposed_cable_route" required>
<option value="" disabled selected>-Select your answer-</option>
<option value="External">External</option>
<option value="Internal">Internal</option>
<option value="Combination">PIA</option>
</select>
</figure>
<figure class="fig" id="cf_building_post_2000">
<label>
<div class="order">B</div>
<p>Is the building post 2000?<span class="asterisk">*</span></p>
</label>
...
JavaScript
document.getElementById("cfsubmit").addEventListener("click", function(){
document.getElementById("cityfibre_form").className="submitted";
});