Can I make a button a toggle for multiple feature layers?

[NMWater]

Hi all! Thanks for taking the time to look into this.

I have two buttons that I added manually into my webmap. One of them is a hover dropdown that shows my layers.

I have six feature layers in total, however 3 of the layers are in inches and 3 are in millimeters. The other button is my unit button (buttona).When I click my unit button (buttona)  the inner.HTML flip flops between Inches and Millimeters (see code below), is there a way to program buttona so that this button looks for the current layer that is currently showing and after its clicked it would display its counter part?

For example: If I have a county layer displaying in inches, when I click "buttona", it would hide the inches layer and display the county millimeters layer? Any help would be greatly appreciated!

Kindest Regards,

Francisco Ochoa

var flipflop = false;

var buttona = document.getElementById("buttona");

buttona.onclick = function change() {

       if (!flipflop) {

            buttona.innerHTML = "Inches";

       } else {

            buttona.innerHTML = "Millimeters" }

  flipflop = !flipflop;

     }

  function showcounties() {

  if ( buttona.innerHTML == "Millimeters" ) {

  showcountymm();

  }

  else {

  showcountyin();

  }

  };

  function showHUC8() {

  if ( buttona.innerHTML == "Millimeters" )

  {showhuc8mm();}

  else { showHUC8in();}};

  function showWPR() {

  if ( buttona.innerHTML == "Millimeters" )

  {showwprmm();}

  else {showwprin();}};

  function showcountymm()  {

  featureLayer.show(); HUC8.hide(); WPR.hide(); CNTYin.hide(); HUC8in.hide(); WPRin.hide();}

  function showhuc8mm() {

  featureLayer.hide(); HUC8.show(); WPR.hide(); CNTYin.hide(); HUC8in.hide(); WPRin.hide();}

  function showwprmm() {

  featureLayer.hide(); HUC8.hide(); WPR.show(); CNTYin.hide(); HUC8in.hide(); WPRin.hide();}

  function showcountyin(){

  featureLayer.hide(); HUC8.hide(); WPR.hide(); CNTYin.show(); HUC8in.hide(); WPRin.hide();}

  function showHUC8in(){

  featureLayer.hide(); HUC8.hide(); WPR.hide(); CNTYin.hide(); HUC8in.show(); WPRin.hide();}

  function showwprin(){

  featureLayer.hide(); HUC8.hide(); WPR.hide(); CNTYin.hide(); HUC8in.hide(); WPRin.show();}

[RobertScheitlin__GISP · Accepted solution]

NM Water,

  I think you are looking for something like this:

var buttona = document.getElementById("buttona");
buttona.onclick = function change() {
  if (WPR.visible || featurelayer.visible || HUC8.visible) {
    buttona.innerHTML = "Inches";
    if(WPR.visible){
      showwprin();
    }
    if(featurelayer.visible){
      showcountyin();
    }
    if(HUC8.visible){
      showHUC8in();
    }
  } else {
    buttona.innerHTML = "Millimeters";
    if(WPRin.visible){
      showwprmm();
    }
    if(featurelayer.visible){
      showcountymm();
    }
    if(HUC8.visible){
      showHUC8mm();
    }
  }
}

[NMWater]

Thank you so much Robert! The code worked perfectly!