CLOSE BUTTON is not working

index.html

@@ -22,7 +22,7 @@
       <span class="font-medium text-red-800">Error</span>
     </div>
     <!-- CLOSE BUTTON -->
-    <button type="button" onclick="removeQuery()"
+    <button type="button" onclick="this.parentElement.parentElement.classList.add('hidden')"
       class="close-alert ml-auto p-2 rounded hover:bg-red-100 focus:outline-none">
       <i data-feather="x" class="w-4 h-4"></i>
     </button>
@@ -46,7 +46,7 @@
       <span class="font-medium text-green-800">Success</span>
     </div>
     <!-- CLOSE BUTTON -->
-    <button type="button" onclick="removeQuery()"
+    <button type="button" onclick="this.parentElement.parentElement.classList.add('hidden')"
       class="close-alert ml-auto p-2 rounded hover:bg-green-100 focus:outline-none">
       <i data-feather="x" class="w-4 h-4"></i>
     </button>
@@ -354,20 +354,16 @@
 
 
         });
-
-        function removeQuery() {
-
-            let url = window.location.href;
-
-            let a = url.indexOf("?");
-            let b =  url.substring(a);
-            let c = url.replace(b,"");
-            window.location.href = c;
-
-        }
-
-
-    </script>
+function removeQuery() {
+    const url = new URL(window.location.href);
+    url.search = '';
+    window.history.replaceState({}, document.title, url);
+    
+    // Also hide the alerts
+    document.getElementById('fail_email').classList.add('hidden');
+    document.getElementById('success_email').classList.add('hidden');
+}
+</script>
 
     <script src="https://www.google.com/recaptcha/api.js?render=6LfWu2YcAAAAAPooSewjuw82sSxhAdh657M4VvzT"></script>