I am trying to change the z-index of a symbol upon hover. This symbol has a number of elements inside of it with their own timeline that triggers upon hover as well. I tried doing so at first through something along the lines of:
sym.getSymbol("mySymbol").css("z-index","10");
This did not work (and it's not the z-index either, I tried changing something basic like border color and it would not do so). However if this were an element as opposed to a symbol, this code would work.
sym.$("myElement").css("z-index","10");
What's confusing to me about this is that if you view the source code of an Edge document, converting a group of elements into a symbol on the HTML side merely throws these elements into a DIV. So why wouldn't you be able to modify the css in the same way you are able to with elements in Edge? Am I doing something wrong? I also tried adding a class name to the symbol, but I am unsure of how to select a css class created through Edge (via the method in the image below).