Multiple background-images with different classes

[SimonPlus]

Hi, I would like to know how you can add multiple background images to an element but with different classes.
For example the css:

.classOne {
  background-image: url(bgOne.png);
}
.classTwo {
  background-image: url(bgTwo.png);
}

and the element:

<div class="classOne classTwo"></div>

The two images have transparent areas sow they overlay.
But with this css, the first background-image just gets replaced with the second.
And the following is not an option 'cause of the hugeness (a lot of classes can be combined) of my project:

.classOne.classTwo {
  background-image: url(bgTwo.png), url(bgOne.png);
}

So I'm looking for some kind of workaround.
I know it's possible with Javascript but I want that to be my last resort.
Thanks in advance for any help(er)!

[Major_Payne]

Haven't checked CSS 3 [w3.org] for a solution, but the images could be positioned absolutely. Background images with CSS must be done individually as the last CSS style takes precedence.

Don't know what size your images are and how large you want them, but you might take a read of this: Multiple background images [quirksmode.org]

Additionally:

Multiple Backgrounds and CSS Gradients [snook.ca]

How To Use Multiple CSS Backgrounds, a Tutorial [firteendesign.com]

[SimonPlus]

...Javascript it is...

[Major_Payne]

LOL. OK. Remember to use the "noscript" tags as many people have learned to surf the Internet with JS turned off. Good luck.

Ron

[patd]

background-image: url(bgTwo.png), url(bgOne.png); this code don't work upto IE8, any hack for it? other then <!--[if IE]--> trik