bg colour change on tick box selection

[neilkw]

hi,

I'm hoping that css can render this, but accept that js may be the best solution.


Background:
I am designing a page where customers can buy bathroom suites plus a host of additional accessories. I display the suite name plus the price in a thin horizontal div (possibly a table - not totally decided yet) with a tick box at the end to confirm selection.

Function:
Is it possible to change the bg colour of this div when the tick box is ticked?
I am very keen to keep the design colour-coded and clear.

I would then repeat this functionality to the div's below which contain the accessory info.

Hope this is clear enough..

Many thanks in advance
Neil

[neilkw]

sorted, js though.


<script>
function changeBGColor(item, color)
{
var pItem = item.parentNode;
while(pItem.nodeName != 'DIV')
pItem = pItem.parentNode;

pItem.style.backgroundColor = color;
}
</script>

<div id="test"><p>Some text</p><input type="checkbox" id="testChk" onclick="changeBGColor(this, 'Red');" style="float: right;" /></div>