My attempt at changing the color of some text within a table based on checkbox selection doesn't seem to be working. The :checked attribute isn't having any effect. Here's the code snippet:
<html>
<head>
<style type="text/css">
.methodoption
{
}
#row1
{
color: blue;
}
#buyer1 + #row1
{
color: blue;
}
#buyer1 input[type=checkbox]:checked ~ #row1
{
color: red;
}
</style>
</head>
<body>
<div align="justify" style="font-size: 23px;">
Social compliance has experienced significant changes in recent years. Due to industry disasters and consumer awareness, stakeholders are reevaluating their approach to compliance. At WRAP, we strive to adapt our programs to meet these evolving needs.</div><br/>
<div align="Center" style="Font-size: 29px;">WE TALKED TO <STRONG>50</STRONG> BUYERS, THOUGHT LEADERS,<br/>AND OTHER STAKEHOLDERS IN THE SOCIAL COMPLIANCE ARENA</div>
<div align="Center"><img src="infogfx.png" height="350" width="900"></div><br/><br/>
<table align="center" width="600" style="background-color: #aaaaaa;"><tr><td align="center"><em><strong style="font-size: 25px;">WHO ARE THEY?</strong></em></td></td>
<tr><td>In exchange for their participation in they survey, we have agreed to keep the identities of those who particiapted anonymous.</td></tr><table>
<form action="" method="post">
<table>
<tr><td><input type="checkbox" name="buyer1" id="buyer1"></td><td>1</td><td class="methodoption"><span id="row1">Stakeholder Expectations</span></td></tr>
<tr><td><input type="checkbox" name="buyer2a" id="buyer2a"></td><td>2(tie)</td><td class="methodoption">Factory Compliance/Strengthen Supply Chain</td></tr>
<tr><td><input type="checkbox" name="buyer2b" id="buyer2b"></td><td>2(tie)</td><td class="methodoption">Corporate Philosophy</td></tr>
<tr><td><input type="checkbox" name="buyer4" id="buyer4"></td><td>4</td><td class="methodoption">Integrity of Brand</td></tr>
<tr><td><input type="checkbox" name="buyer5a" id="buyer5a"></td><td>5(tie)</td><td class="methodoption">Risk Management</td></tr>
<tr><td><input type="checkbox" name="buyer5b" id="buyer5b"></td><td>5(tie)</td><td class="methodoption">Right Thing To Do</td></tr>
</table></form>
</body>
</html>