Conditionally enqueue a stylesheet based off of a javascript click event

I think you’re working too hard!

My approach to this would be to load all the stylesheets, then use JS to manipulate the BODY with an appropriate modifying class.

An example

You have 3 stylesheets: default.css, red.css, blue.css. Load them all on page load.

default.css body { background: #ccc; color: black;}

red.css body.red { background: red; color: white;}

blue.css body.blue { background: blue; color: white;}

Then just use JS to modify the classes on the BODY tag and the CSS will follow.