How to refresh layers and ui elements in google earth engine app?

Question

I want to create a Google Earth Engine app. When a user selects something from the dropdown element and clicks on the load button I want it to load that particular layer and its label displayed on map.

The problem I am facing is that when user clicks on Display button again and again, it loads the same layer number of times the button is clicked. Also, I want to hide the other layers that were loaded first when any other element from the list is selected.

This is my code https://code.earthengine.google.com/882a81c42e593ddaa8461e65b98f269c

var srtm = ee.Image("USGS/SRTMGL1_003");
var modis_ndvi = ee.ImageCollection("MODIS/061/MOD13A2").first();
// Select Element
var variables = ['SRTM','MODIS NDVI'];
var Selector = ui.Select({
  items: variables,
  placeholder: 'Select',
  style:{position: 'top-left', width:'150px'}
  })

var button = ui.Button({
  label:'Display',
  style: {margin:'15px 0 0 0'},
})
var panel_selector = ui.Panel({
    widgets: [Selector, button],
    layout: ui.Panel.Layout.Flow('horizontal'),
    style: {position: 'top-right'},
  });
Map.add(panel_selector)

var loadComposite = function() {
  var gv = Selector.getValue();
  if(gv=="SRTM"){
  Map.addLayer(srtm,{min:200, max:4000, palette:['yellow','orange','red']},'SRTM');
  var label_srtm = ui.Label({value:'SRTM 30m'})
  Map.add(label_srtm)
  }
  else if(gv=="MODIS NDVI"){
    Map.addLayer(modis_ndvi,{},'MODIS NDVI');
    var label_modis = ui.Label({value:'MODIS 1NDVI km'})
    Map.add(label_modis)
  }
  
};

button.onClick(loadComposite);

How to fix it?

I have tried ui.root.clear and but that hides everything

Answer 1

Use Map.clear() which will clear all previously loaded layers.