It's not even a lot of JavaScript. It's similar to the answer here…
I didn't download your template, but it sounds like creating lots and lots of triangles with Hype's vector shape tool. Then, each one of those shapes could be modified with CSS. That's the trick, because targeting the SVG created by Hype is a little cumbersome.
So, I did a test. I made a three-sided polygon and tried to change its color with CSS. I'm thinking this might be what you're looking for…
.orange * {
fill: orange !important;
}
It's a bit brutal with the CSS Wildcard Selector, but the SVG in the element should be the end of the element tree. Hype doesn't have complex SVG shapes.
So, using the one line of modified code from the "clicky" template…
hypeDocument.getElementById(element.id).classList.toggle("orange")
…and adding the CSS to the HTML Head of the Hype project, the triangles can be toggled on and off.
This is just theoretical, but here's a proof-of-concept template…
orange-triangles-test.zip (20.3 KB)
…or you could just draw all of your triangles with SVG and JavaScript. That seems like a bad idea though. If you're doing that, then you probably don't need Hype. 
But if someone searched for "Triangles", they might find this additional information useful…