Layer List widget won't go away

Question

Hello, I'm trying to toggle a Layer list widget but the code is not working. It should respond to a click event on a button that switches its value to on/off. So far it creates the widget and adds it to the map. The part that doesn't work is when trying to remove the widget. Thank you in advance, var boff=document.getElementById("onoff"); boff.addEventListener('click',function () { currentvalue=boff.value; if(currentvalue == "Off"){ document.getElementById("onoff").value="On"; view.when(function () { var layerList = new LayerList({ view: view }); // Add widget to the top right corner of the view view.ui.add(layerList, "top-right"); }); } else{ view.ui.remove('layerList'); document.getElementById("onoff").value="Off"; } })‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

kenbuja · Accepted Answer

Declare layerList outside of the event listener and remove the quotes from line 21 let boff = document.getElementById("onoff"); let layerList; boff.addEventListener('click', function () { currentvalue = boff.value; if (currentvalue == "Off") { document.getElementById("onoff").value = "On"; view.when(function () { layerList = new LayerList({ view: view }); // Add widget to the top right corner of the view view.ui.add(layerList, "top-right"); }); } else { view.ui.remove(layerList); document.getElementById("onoff").value = "Off"; } })‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍