Use part of class name as a css variable

Question

I'm using css to change the sizes of two divs so that their size represents some value that changes a few times per session.

Is there anyway to define a css class something like:

.shiftydiv(*) {
    width:\1;
}

where \\1 is whatever * matched? Then I can just add a class like .shiftydiv25 via jquery whenever I need to change the size.

I don't need legacy support for browsers and I'd prefer not adding any dependencies. If I can't do it with pure css I'll either create CSS classes dynamically or inject style= attributes into my code. Which would be better (less bad).

EDIT: If there is a nice way to do this with JS/jquery that would work well too.

EDIT 2: So doing this with js is actually quite easy. oops

Answer 1

Maybe instead pure CSS use SASS/LESS and generate multiple classes?

You can use for loop and iterate over lets say 20 elements and make .shiftydiv1, shiftydiv2, ... shiftydiv20.