Hide a component shown by loadComponent
===

I am loading a component in doGet, and after a click event I am trying to hide that component and show another.  _These were made in GUI Builder._  First of all, is it even possible to have 2 different components?  If so, how can I get the 2nd component to show up on top of the other?  Here is my code:

    function doGet() {
     var app = UiApp.createApplication();

      app.add(app.loadComponent("first", {"z-index": "1"}));

      return app;
    }

    function myClickHandler(e) {
       var app = UiApp.getActiveApplication();

       var label = app.getElementById('statusLabel');
       label.setVisible(true);
  
       app.close();
       return app;
    }

    function afterClick(){
       var app = UiApp.getActiveApplication();
        app.add(app.loadComponent("second", {"z-index": "100"}));

     return app;
    }