maybe more clear menu icon structure

static/script.js

@@ -33,14 +33,11 @@ function hideOthers(name) {
     }
 }
 function dropDown(name) {
+    dropDownHide();
     document.getElementById(name).classList.toggle("show");
     hideOthers('foo');
 }
-
-// Close the dropdown menu if the user clicks outside of it
-window.onclick = function(event) {
-  if (!event.target.matches('.dropbtn')) {
-
+function dropDownHide() {
     var dropdowns = document.getElementsByClassName("dropdown-content");
     var i;
     for (i = 0; i < dropdowns.length; i++) {
@@ -49,6 +46,12 @@ window.onclick = function(event) {
         openDropdown.classList.remove('show');
       }
     }
+}
+
+// Close the dropdown menu if the user clicks outside of it
+window.onclick = function(event) {
+  if (!event.target.matches('.dropbtn')) {
+    dropDownHide();
   }
 }