How to hide or show a layer or graphic symbol by its name in Adobe Animate (HTML5)

I toggle the visibility of symbols and layers all the time.  However, you can’t do it use a graphic symbol because it must be named.  That’s not a problem; it’s easy to re-designate it.  Just select the symbol, click ctrlF3 to pop up the properties window, and make sure Object is selected.  At the top of the window there’s a drop down that allows you to choose to make the symbol a movie clip, button or graphic.  Pick Movie Clip, and enter a name into the dialog box immediately below the drop down.  For instance, you could call it SymbName. 

Next you will need to assign a variable.  Here’s the required ActionScript command.

var togSymb:Boolean = true;  

togSymb is just the name to designate the variable.  You can use any name you like.  I put this command into the first frame of the file. 

Now you’re ready to enter the following action script.  This could be in the keyframe where the symbol is located, however it’s good practice to isolate your action script and object in separate layers. 

SymbName.visible = togSymb;

SymbName.addEventListener(MouseEvent.CLICK, FunctName);

function FunctName (event:MouseEvent):void

{          togSymb = !togSymb;

SymbName.visible = togRATE;

}

When you play your swf, every time you click the symbol then it will vanish.  The only problem is that because you’ve hidden the symbol you can’t toggle it back on without additional code.  One solution is put another instance of the symbol in a layer beneath the first.  Set the alpha of this second symbol to 0 to make it transparent.  Thus, it will be there to click but won’t be seen.  You can then give the transparent copy a different name and enter the code like what’s shown above to toggle the visibility of the first symbol back on.  If it’s not clear how to do that let me know and I’ll be happy to provide additional instructions.

Now as far as layers, it would be nice if you could just hide them directly, but I haven't found a method for doing so.  If anyone else knows of one I would very much like to learn it.  What I do is create a movie clip symbol that covers the screen, that's the same color as the background.  I then place it into a layer that above all of the other layers I might want to hide.  I then use the method describe above to toggle the visibility of that symbol.  When a user clicks the background the visibility of all the lower layers will toggle on and off.  You can also attach the listener to buttons.  If you would like instructions for doing that please let me know.