Ja, der var jo lige et par klumper ...
<html>
<head>
<style type="text/css">
.statusArrow{
background:#0f0 url('img/arrow_green_left.gif') no-repeat top left;
width:200px;
height:50px;
}
.status{
background:#ff0000 url('img/status_green.gif') no-repeat top left;
width:200px;
height:50px;
}
</style>
<script type="text/javascript">
function changeBackgroundImages(){
cssrules = document.styleSheets[0].rules;
alert(cssrules.length);
for(i=0;cssrules.length>i;i++){
alert(cssrules[i].style.background+"\n"+cssrules[i].selectorText);
if(cssrules[i].selectorText=='.statusArrow')
cssrules[i].style.background="#0ff url('img/arrow_green_up.gif') no-repeat top left";
if(cssrules[i].selectorText=='.status')
cssrules[i].style.background="#fff url('img/status_green.gif') no-repeat top left";
alert(cssrules[i].style.background);
}
}
</script>
<body>
<button onclick="changeBackgroundImages()">Tryk her</button><br><br>
<div id="arrow1" class="statusArrow"></div>
<div id="status1" class="status"></div>
<div id="arrow2" class="statusArrow"></div>
<div id="status2" class="status"></div>
<div id="arrow3" class="statusArrow"></div>
<div id="status3" class="status"></div>
<div id="arrow4" class="statusArrow"></div>
<div id="status4" class="status"></div>
<div id="arrow5" class="statusArrow"></div>
<div id="status5" class="status"></div>
</body>
</html>
-- så kan den ses ...
