How do I override a (css) metaclass property using a GreaseMonkey script?

Question

My goal here is to make a script which will remove spoiler styling from /r/avatar.

By playing around with the "inspect element" element feature of Firefox I've managed to find the code in one of the CSS sheets which makes spoilered titles transparent. It looks like this

html:not([lang="ns"]) .thing.over18 a.title{
opacity:0.0
}

I've been searching for a way to override this attribute from greasemonkey, but I'm not sure how. I'm new to javascript: I've been trying to make use of

document.getElementsByClassName('.thing.over18')

to try and grab the elements with the (meta?)class attached to them, but no matter how I play with the class name I cant get it to select the right elements (I have an inkling that I'm not using the right function now).

There was actually a script on userscripts.org which did something similar (unspoiler /r/pokemon), but it seems that userscripts has been down so I cant look at its source.

Answer 1

There is no such thing as a "metaclass" in CSS or HTML. .thing is a class selector. .over18 is another class selector. You just have two class selectors.

getElementsByClassName only accepts a single class name.

document.getElementsByClassName('thing')
document.getElementsByClassName('over18')

If you want to use a selector, then use querySelector (for a single element) or querySelectorAll (for a NodeList).

document.querySelectorAll(".thing.over18");