Board Thread:Support Requests - Getting Technical/@comment-17033657-20150627015803/@comment-452-20150627123629

Here's how I achieved the same thing with CSS instead of Javascript:

Example: (updated with custom toggle)

CSS: .mw-made-collapsible:not(.mw-collapsed) .toggle-expand, .mw-made-collapsible.mw-collapsed .toggle-collapse { display: none; }

.mw-made-collapsible.mw-collapsed .toggle-expand, .mw-made-collapsible:not(.mw-collapsed) .toggle-collapse { display: block; }

Obviously, it would need a couple of modifications to work with a custom toggle
 * Edit: I decided to check, and it "just works".

The basic idea is that instead of changing the text, the visibility of each word is toggled in reverse of the content it's toggling.

Since collapsibles are javascript based anyway, there will be no visible difference between the two solutions, so you might as well stick with the javascript solution, since it's working for you.