var style = document.createElement('style');
style.type = 'text/css';
style.innerHTML = '.cssClass { color: #F00; }';
document.getElementsByTagName('head')[0].appendChild(style);

document.getElementById('someElementId').className = 'cssClass';

// style element or locally sourced link element
var sheet = YAHOO.util.StyleSheet(YAHOO.util.Selector.query('style',null,true));

sheet = YAHOO.util.StyleSheet(YAHOO.util.Dom.get('local'));


// OR the id of a style element or locally sourced link element
sheet = YAHOO.util.StyleSheet('local');


// OR string of css text
var css = ".moduleX .alert { background: #fcc; font-weight: bold; } " +
		  ".moduleX .warn  { background: #eec; } " +
		  ".hide_messages .moduleX .alert, " +
		  ".hide_messages .moduleX .warn { display: none; }";

sheet = new YAHOO.util.StyleSheet(css);

<div id="mydiv"><p>Some content</p></div>

<script type="text/javascript">
function change(){
    document.getElementById("mydiv").style.backgroundColor = "#ff0000";
}
</script>

<script>
$(document).ready(function() {
  // add 'style="height:30px;"' to the div with id="foo".
  $('#foo').attr("style", {height: "30px"})
});
</script>

<script>
$(document).ready(function() {
  // add 'style="height:30px;"' to all elements with class="bar".
  $('.bar').attr("style", {height: "30px"})
});
</script>