Several dropdowns on top of each other but it's not clickable

Question:
So I have #dropdown1 which has multiple options, let’s say if u click option A, #dropdown2 will show, but if u click option B #dropdown3 will show up. And #dropdown2 & #dropdown3 is stacked on top each other, but only #dropdown2 can be clicked, I assume this because #dropdown2 is on top of all in the editor. How can I make the other dropdown can be clicked aswell?

Product:
Wix Editor

What are you trying to achieve:
I want to make #dropdown2 and #dropdown3 all clickable.

What have you already tried:

export function dropdown1_change(){
 if ($w("#dropdown1").value == "Surabaya"){
          $w("#dropdown1").show();
        } 
 else {
   $w("#dropdownSurabaya").hide();
 }

 if ($w("#dropdown1").value == "Sidoarjo"){ 
         $w("#dropdown2").show();
        } 
 else {
  $w("#dropdown2").hide();
 }
}

Additional information:
This is the default value of #dropdown2 and #dropdown3

Screenshot 2023-12-04 at 08.26.05

You can change the order of elements with: Wix Editor: Arranging Elements Using Right-Click | Help Center | Wix.com