Stuck ( CSS / DIV Background Workaround )

When using CSS / HTML I want to use one DIV Class with different backgrounds.

from the CSS

[code]
#aboutleftside {
clear: left;
float: left;
width: 165px;
height: 190px;
margin: 0px 0px 0px 7px;
padding: 10px 0px 0px 18px;
background: url(images/aboutLeft.jpg);
background-repeat: no-repeat;
line-height: 1.2em;
}
[/code]

however, instead of bloating the CSS file with the same class over and over with all the attributes of that class (ie, #aboutleftside p, p a, p a:hover, ect ect) I was wondering if it would be possible to do something along these lines.

[code]
#aboutleftside {
clear: left;
float: left;
width: 165px;
height: 190px;
margin: 0px 0px 0px 7px;
padding: 10px 0px 0px 18px;
[I][COLOR=”Red”] background: url(images/aboutLeft.jpg);[/COLOR][/I]
background-repeat: no-repeat;
line-height: 1.2em;
}
[/code]

remove the red and use it in the page as follows

[code]<div id=”aboutleftside” background=”images/aboutLeft.jpg”>
</div>

<div id=”aboutleftside” background=”images/aboutLeft2.jpg”>
</div>
[/code]

so that i can manipulate the background image and simply use the same DIV Class, i am having a serious brain meltdown right now, and for some reason the code is not appearing in my head on how to get around this simple fix.

Also in #CSS _↴