Three Google Form Submissions - html

Question

I have three google forms on a page. Each form is linked to a tab on a single spreadsheet.
For now I have duplicated the working code from here: https://codepen.io/xergioalex/pen/ZNevvM
A single form was working fine, however now that there are three it no longer functions.
All inputs eg. "entry.472617792" should be correct.
Link to public Spreadsheet.
// Form01
$('#contact-form01').submit(function(event) {
event.preventDefault();
$('#feedback01').html('');
setTimeout(function() {
// Get data
var data = {
'entry.472617792': $('#form-name01').val(),
'entry.898916053': $('#form-phone01').val(),
'entry.1085111698': $('#form-message01').val()
};
// Validate form
var formSuccess = true;
Object.keys(data).forEach(function(key, index) {
if (!data[key]) {
formSuccess = false;
$('#feedback01').html('<label class="text-danger">Please complete all fields</label>');
}
});
if (formSuccess) {
// Send request
$.ajax({
url: 'https://docs.google.com/forms/u/2/d/e/1FAIpQLSfiJghWBgMBn-twEzVfeIWMQhyp_3oFa26r1bdA-A71n_3Enw/formResponse',
type: 'POST',
crossDomain: true,
dataType: "xml",
data: data,
success: function(jqXHR, textStatus, errorThrown) {
console.log('Enter on success');
$('#feedback01').html('<label class="text-success">Message sent!</label>');
},
error: function(jqXHR, textStatus, errorThrown) {
console.log('Enter on error');
$('#feedback01').html('<label class="text-success">Message sent!</label>');
}
});
}
}, 300);
});
// Form02
$('#contact-form02').submit(function(event) {
event.preventDefault();
$('#feedback02').html('');
setTimeout(function() {
// Get data
var data = {
'entry.472617792': $('#form-name02').val(),
'entry.898916053': $('#form-phone02').val(),
'entry.1085111698': $('#form-message02').val()
};
// Validate form
var formSuccess = true;
Object.keys(data).forEach(function(key, index) {
if (!data[key]) {
formSuccess = false;
$('#feedback02').html('<label class="text-danger">Please complete all fields</label>');
}
});
if (formSuccess) {
// Send request
$.ajax({
url: 'https://docs.google.com/forms/u/2/d/e/1FAIpQLSfnPLSloZWtGXTqhexuJsb9LoEA9U8-uYGYj3Ex5SS5Nwty0w/formResponse',
type: 'POST',
crossDomain: true,
dataType: "xml",
data: data,
success: function(jqXHR, textStatus, errorThrown) {
console.log('Enter on success');
$('#feedback02').html('<label class="text-success">Message sent!</label>');
},
error: function(jqXHR, textStatus, errorThrown) {
console.log('Enter on error');
$('#feedback02').html('<label class="text-success">Message sent!</label>');
}
});
}
}, 300);
});
// Form03
$('#contact-form03').submit(function(event) {
event.preventDefault();
$('#feedback03').html('');
setTimeout(function() {
// Get data
var data = {
'entry.472617792': $('#form-name03').val(),
'entry.898916053': $('#form-phone03').val(),
'entry.1085111698': $('#form-message03').val()
};
// Validate form
var formSuccess = true;
Object.keys(data).forEach(function(key, index) {
if (!data[key]) {
formSuccess = false;
$('#feedback03').html('<label class="text-danger">Please complete all fields</label>');
}
});
if (formSuccess) {
// Send request
$.ajax({
url: 'https://docs.google.com/forms/u/2/d/e/1FAIpQLSfK6S-GlcKsq8YCz4OBwlTsf9g8frbGouP4VGkyXiykaH1UMw/formResponse',
type: 'POST',
crossDomain: true,
dataType: "xml",
data: data,
success: function(jqXHR, textStatus, errorThrown) {
console.log('Enter on success');
$('#feedback03').html('<label class="text-success">Message sent!</label>');
},
error: function(jqXHR, textStatus, errorThrown) {
console.log('Enter on error');
$('#feedback03').html('<label class="text-success">Message sent!</label>');
}
});
}
}, 300);
});
.container {padding-bottom:50px;}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--Form 01-->
<div class="container">
<h2>Form 01</h2>
<form method="post" id="contact-form01">
<input type="text" class="form-control" id="form-name01" placeholder="Name*"><br>
<input type="text" class="form-control" id="form-phone01" placeholder="Phone*"><br>
<textarea type="text" class="form-control" id="form-message01" placeholder="Message*"></textarea><br>
<button type="submit" class="btn btn-default">
Submit
</button>
<div id="feedback01"></div>
</form>
</div>
<!--Form 02-->
<div class="container">
<h2>Form 02</h2>
<form method="post" id="contact-form02">
<input type="text" class="form-control" id="form-name02" placeholder="Name*"><br>
<input type="text" class="form-control" id="form-phone02" placeholder="Phone*"><br>
<textarea type="text" class="form-control" id="form-message02" placeholder="Message*"></textarea><br>
<button type="submit" class="btn btn-default">
Submit
</button>
<div id="feedback02"></div>
</form>
</div>
<!--Form 03-->
<div class="container">
<h2>Form 03</h2>
<form method="post" id="contact-form03">
<input type="text" class="form-control" id="form-name03" placeholder="Name*"><br>
<input type="text" class="form-control" id="form-phone03" placeholder="Phone*"><br>
<textarea type="text" class="form-control" id="form-message03" placeholder="Message*"></textarea><br>
<button type="submit" class="btn btn-default">
Submit
</button>
<div id="feedback03"></div>
</form>
</div>