Changing css style sheet with javascript

I have the following:

<style>
    .el {color: blue;}
</style>

<div class="el">bla bla</div>
<div class="el">bla bla 123</div>

And i need to use JavaScript to change the color in .el. I know about document.styleSheets but that seems kind of crude, having to loop search for the class i want to change it that way. Isn't there some better (lighter) way to do this nowadays? Something like

document.stylesheets.getclass('.el').color = 'red';

Thanks.

You're on the right track. The method you're looking for is getElementsByClassName, not getClass. It returns an array, and then you simply loop through the array and assign the new color.

var el = document.getElementsByClassName('el'),
    i;

for (i = 0; i < el.length; i += 1) {
    el[i].style.color = 'red';
}

Demo

P.S., obviously, this changes the style, not the stylesheet.