How to style with Y.StyleSheet

Question

I am trying to style an element using Y.StyleSheet.

This is how I am currently doing it, and it works fine: http://jsfiddle.net/AxUMD/47/

document.documentElement.className += ' js';

Y.one('#techsolutionsCheckBox input[type=checkbox]').on('change', function (e) {
    var target = e.currentTarget,
        techSBox = Y.one('.box'),
        techSBlueBox = document.getElementById( 'techsolutions' );
        colourBlue = "#cee4f2",
        colourWhite = "#ffffff";

    if (target.get('checked')) { 
       techSBox.removeClass('hidden');
       techSBlueBox.style.backgroundColor = colourBlue;
       techSBlueBox.style.width = "380px"; 
       techSBlueBox.style.height = "100px";
    } else {
        techSBox.addClass('hidden');
        techSBlueBox.style.backgroundColor = colourWhite;
        techSBlueBox.style.width = null; 
        techSBlueBox.style.height = null;
    }
});

but this is how I would like to do it: http://jsfiddle.net/AxUMD/57/ but it is not working as I thought it would.

document.documentElement.className += ' js';

Y.one('#techsolutionsCheckBox input[type=checkbox]').on('change', function (e) {
    var target = e.currentTarget,
        techSBox = Y.one('.box'),
        techSBlueBox = Y.one(Y.DOM.byId("#techsolutions")),
        changesChecked = { background-color : '#cee4f2', width : '380px', height : '100px' },
        changesUnChecked = { background-color : '#ffffff', width : null, height : null },
        currentStyle = techSBlueBox.getStyle('cssText');

    if (target.get('checked')) { 
       techSBox.removeClass('hidden');
       techSBlueBox.setStyle('cssText', Y.StyleSheet.toCssText(changesChecked, currentStyle));
    } else {
        techSBox.addClass('hidden');
        techSBlueBox.setStyle('cssText', Y.StyleSheet.toCssText(changesUnChecked, currentStyle));
    }
});

Any help would be greatly appreciated.

Thankyou

Answer 1

Thankyou, I have achieved the same by using a css class:

.showBlueBox {
    background-color:#cee4f2;
    width : 370px;
    height : 100px;
}

and then added this code to use the styles:

techSBlueBox.addClass('showBlueBox');