JavaScript

const searchParams = new URLSearchParams(location.search);
for (const [key, value] of searchParams) {
    console.log(key, "=", value);
}

const searchParams = new URLSearchParams(location.search);
for (const [key, value] of searchParams) {
    let element = document.getElementsByName(key)[0];
    if (element && element.classList.contains("dropdown") && (/^INPUT|SELECT$/i).test(element.tagName)) {
        element.value = value;
    }
    else {
        console.warn("Unknown element:", key, element);
    }
}

const searchParams = new URLSearchParams(location.search);
let index = 0;

for (const [key, value] of searchParams) {
    let element = document.getElementsByClassName("dropdown")[index];
    element.value = value;
    index++;
}

let element = document.getElementsByClassName("dropdown")[index];
let option = document.createElement("option");
option.value = value;
option.text = value;
element.add(option, null);
element.value = value;

 <div class='payroll-container row p-5'>	
<form action ="overheads5.html"  method 
= "get" name = "payrate" id = 
"payrate"> Payrate
<br/>

Level 1

<input type = "text" name = 
"level-1" id = "level-1" />
<br/>

Level 2
<input type = "text" name = 
"level-2" id = "level-2" />
<br/>

Level 3
<input type = "text" name = 
"level-3" id = "level-3" />
<br/>

Level 4
<input type = "text" name = 
"level-4" id = "level-4" />
<br/>

Level 5
<input type = "text" name = 
"level-5" id = "level-5" />
<br/>

Level 6
<input type = "text" name = 
"level-6" id = "level-6" />
<br/>
<input type = "submit"/>

<div class='dropdown-container row p-4'>	  
<select>
<option class = 'dropdown'>level-1</option>
<option class = 'dropdown'>level-2</option>
<option class = 'dropdown'>level-3</option>
<option class = 'dropdown'>level-4</option>
<option class = 'dropdown'>level-5</option>
<option class = 'dropdown'>level-6</option>
	  </select></div>

const searchParams = new URLSearchParams(location.search);
for (const [key, value] of searchParams) {
    let element = document.getElementById(key);
    if (element) {
        element.value = value;
    }
    else {
        console.warn("Unknown element:", key, element);
    }
}

<script>
const searchParams = new URLSearchParams(location.search);
for (const [key, value] of searchParams) {
    let element = document.getElementById(key);
    if (element) {
        element.value = value;
    }
    else {
        console.warn("Unknown element:", key, element);
    }
}
</script>

<div class='dropdown-container row p-4'>
    <select>
        <option class='dropdown'>level-1</option>
        <option class='dropdown'>level-2</option>
        <option class='dropdown'>level-3</option>
        <option class='dropdown'>level-4</option>
        <option class='dropdown'>level-5</option>
        <option class='dropdown'>level-6</option>
    </select>
</div>

const searchParams = new URLSearchParams(location.search);
const elements = document.getElementsByClassName("dropdown");
let index = 0;

for (const [key, value] of searchParams) {
    let element = elements[index];
    element.text = value;
    index++;
}

$("#closing-time").keyup(function(){

$(function(){ 
$("#closing-time").keyup(function(){
	var openingTime = $("#openingTime").val();
	var closingTime = $("#closingTime").val();
     $("hoursOpen").html(closingTime-openingTime);
	return hoursOpen.html;

$("hoursOpen")

$("#hoursOpen")

$(function(){
    // Convert either "HH.mm" or "HH:mm" to the number of minutes since midnight
    var parseMinutes = function(value){
        var parts = value.split(/[.:]/g);
        switch (parts.length) {
            case 1: {
                return parseFloat(parts[0]) * 60;
            }
            case 2: {
                var hours = parseFloat(parts[0]);
                var minutes = parseFloat(parts[1]);
                return (hours * 60) + minutes;
            }
            default: {
                return 0;
            }
        }
    };
    
    // Format a number of minutes as "HH:mm"
    var formatMinutes = function(minutes){
        var hours = Math.floor(minutes / 60);
        minutes %= 60;
        
        return hours.toString().padStart(2, '0') + ':' + minutes.toString().padStart(2, '0');
    };
    
    var updateHoursOpen = function(){
        var openingTime = $("#opening-time").val();
        var closingTime = $("#closing-time").val();
        
        var openingMinutes = parseMinutes(openingTime);
        var closingMinutes = parseMinutes(closingTime);
        var minutesOpen = closingMinutes - openingMinutes;
        
        // If closing is before opening, the time spans midnight. Add a day's worth of minutes:
        if (minutesOpen < 0) {
            minutesOpen += 1440;
        }
        
        var hoursOpen = formatMinutes(minutesOpen);
        $("#hoursOpen").val(hoursOpen);
        return hoursOpen;
    };
    
    // Update the hours when either input is changed:
    $("#opening-time, #closing-time").keyup(updateHoursOpen);
});