Change Widget Class using if statement in css

I have a set of button widgets that have a style defined in my theme. I want to be able to change what class they use depending on the value of testSwitch_1

So I thought that I could do it by putting the following in the css box of the button widget:

:host { #{@{testSwitch_1} == 1 ? "class: wizardGreenBtn;" : "class: wizardGreenBtnImage;"} }

but it doesn't work...

This was just going to be the test case as I want to set up a number of values for testSwitch_1 and then use my custom module to have a number of conditions to change the class.

The class keyword parsing is in fault here, adding a new line after ":host {" will fix it.

Awesome - fixed. Thanks

So I've come back to this...

I have a grid of buttons that I can change all the labels on using my custom module.

I am wondering if it would be possible to change the class of the button from the custom module.

without copying all my script (as it's huge), I have a variable instrument that I can index from 0 - 300 that contain all sorts of bits of info

var instrument = {
'5':{ etc }
'6':{'libraryLabel':['8Dio Liberis'],'ExpMapLabel':['8DL Liberis Ens Marcatos [ve]'],'VSTiView':[3],'trackArticulations':['Ah','Doh','Fah','Meh','Reh','Soh'],'VSTiOSC Template':['8DL Standard VSTi'],'controllernames':[],'controllerCCValues':[],},
'7': { etc }
}

The labels are then added to the button grid using a simple loop

 var gridSize = instrument[instrNumber].trackArticulations.length //number of buttons //InstrNumber is the position in the Object "instrument" // Need to take off the QC list at the end
  var artLabelTexts = Object.values(instrument)[instrNumber].trackArticulations;   //Collects the articulation variables from the big list above

		for (i = 0; i < gridSize; i++) {
			var artText = artLabelTexts[i] //collects each label from the object labeltexts that has just been created at position [i]
			receiveOsc({
                address: Object.values(artButtons)[i], //this controls the visibility of the buttons
                args: [
                    {type: 'i', value: 1}
                ]
			})
			receiveOsc({
                address: Object.values(artLabels)[i], //this populates the labels on the buttons based on the array
                args: [ 
			{type: 's', value: artText}
			]
            })
		}

So excuse the terminology and syntax errors but what I was wondering was could I add another object in to the variable instrument, say 'artType':[1,2,1,3,5,2],'

artType classifications will correspond to the equivalent position in trackArticulations Then this is the bit that not sure about - maybe use an if statement that says

if (artType ==1) {address: Object.values(artButtons)[i], buttonClass = 'articulationLong'}

I'm completely making the last bit up as I have no idea where to start with that - bt the behaviour that I want to achieve is for the button to be a different colour based on a classification of the articulation.