Classes for annotations

yep, the annotations are styleable – see more info here
https://www.soft8soft.com/docs/manual/en/introduction/Styling-Verge3D-Apps.html#Annotations

you can also use the set style puzzle to style the annotations individually (their HTML elements got unique ids)
https://www.soft8soft.com/docs/manual/en/puzzles/HTML.html#set_style

You can add class name to each annotation manually after it was created like this:

@Mikhail I am trying to add class with your method, with custom JS function or any other method. In the inspector I can see that there has been a change in class for this element (as it highlights), however the class returns to just being “v3d-annotation” at the same time.
I have added switch button that changes specific colors in my project. I want this switch to change colors of annotations as well. There is possibility of changing the style of annotation with puzzles, but
1. I can’t target :before of the dialog with puzzles
2. I have 11 annotations and using setStyle for each of them seems inefficient.
simple addClass would do the work

@Mikhail
I have actually been able to solve it with a simple trick. But first what I have tried and why it didn’t work.

1. Tried separate HTML elements and bind them to the objects, but I loose on “transparent annotation” functionality and the whole toggle annotations logic
2. Tried to put html elements inside of the annotation label (it actually takes HTML, not a string), but then I couldn’t use the annotation container, as the innerHTML was covering it.

Now the solution was actually to wrap annotations right after creation

`
app.ExternalInterface.annotations = function wrapAnnotations() {
var addnotations = document.getElementsByClassName(‘v3d-annotation’)
for (var i = 0; i < addnotations.length; ++i) {
var item = addnotations;
var wrapper = document.createElement(‘div’);
wrapper.classList.add(‘annotation-wrapper’)
wrapper.classList.add(‘color-blue’)
item.parentNode.insertBefore(wrapper, item);
wrapper.appendChild(item);
}
}
`
then I can target the annotation-wrapper class in JS, so I can add classes to it. Having wrapper I can target any child of it
P.S. i’m not used to vanillaJS, so the above code might require refactoring