trying to make a working dropdown

ui/general/health.html

@@ -23,13 +23,21 @@
         <div class="col-12">
             <div class="card">
                 <div class="card-header">
-                    <img src="assets/icons/drone-icon.svg" class="me-2"/><span>Select a Drone for Inspection</span>   
+                    <img src="assets/icons/drone-icon.svg" width="50px" height="50px" class="me-2"/><span>Select a Drone for Inspection</span>   
                 </div>
                 <div class="card-body">
                     <div class="row mb-3">
                         <div class="col-md-4">
-                            <label for="drone" class="form-label">Drone</label>
+                            <div class="dropdown">
-                            <select id="drone" class="form-select"></select>
+                                <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                                  Dropdown button
+                                </button>
+                                <div class="dropdown-menu" aria-labelledby="dropdownMenuButton">
+                                  <a class="dropdown-item" href="#">Action</a>
+                                  <a class="dropdown-item" href="#">Another action</a>
+                                  <a class="dropdown-item" href="#">Something else here</a>
+                                </div>
+                            </div>
                         </div>
                     </div>
                 </div>

ui/general/health.js

@@ -1,9 +1,40 @@
 
 // Elements
+const drone = document.getElementById("drone");
+
+const drones = [
+    // 2.4 GHz Channels
+    ["1", "mu1"], ["2", "mu2"], ["3", "mu3"],
+    ["4", "mu4"], ["5", "mu5"], ["6", "mu6"]
+]
 
 // Load initial settings
 document.onload = initPage();
 
 // Function to initialize the page
 function initPage() {
+
+}
+
+function successReadFile(content) {
+    try {
+        //  Drone selection
+        const currentDrone = getValueByKey(content, "common", "drone");
+
+        addDropDown(drone, drones, currentDrone);
+    } catch (e) {
+        failureReadFile(e);
+    }
+}
+
+// Restart wifibroadcast service
+function restartDroneDisplayService() {
+    cockpit.spawn(["systemctl", "restart", "dronedisplay@drone"], { superuser: "require" })
+        .then(() => {
+            displaySuccess("dronedisplay@drone service restarted.");
+        })
+        .catch((error) => {
+            console.error("Failed to restart dronedisplay@drone service:", error);
+            displayFail("Failed to restart dronedisplay@drone service: " + error);
+        });
 }