I have this script and the rows that have td class "
odd" will not toggle the blue color that the rows without the class "
odd" do. anybody know why?
//Used to make a row turn blue if available
$('tr:not(theadtr)').toggle(function() {
$(this).addClass("hltclick"); },
function() {
$(this).removeClass("hltclick");
});
and this table
<table>
<thead>
<tr class="border">
<td>Start Time</td>
<td>End Time</td>
</tr>
</thead>
<tbody>
<tr class="border">
<td class="
odd"><a href="#">7:00am</a></td>
<td class="
odd"><a href="#">8:00am</a></td>
</tr>
<tr class="border">
<td><a href="#">8:00am</a></td>
<td><a href="#">9:00am</a></td>
</tr>
<tr class="border">
<td class="
odd"><a href="#">9:00am</a></td>
<td class="
odd"><a href="#">10:00am</a></td>
</tr>
<tr class="border">
<td><a href="#">10:00am</a></td>
<td><a href="#">11:00am</a></td>
</tr>
<tr class="border">
<td class="
odd"><a href="#">11:00am</a></td>
<td class="
odd"><a href="#">12:00pm</a></td>
</tr>
<tr class="border">
<td><a href="#">1:00pm</a></td>
<td><a href="#">2:00pm</a></td>
</tr>
<tr class="border">
<td class="
odd"><a href="#">2:00pm</a></td>
<td class="
odd"><a href="#">3:00pm</a></td>
</tr>
<tr class="border">
<td><a href="#">3:00pm</a></td>
<td><a href="#">4:00pm</a></td>
</tr>
<tr class="border">
<td class="
odd"><a href="#">4:00pm</a></td>
<td class="
odd"><a href="#">5:00pm</a></td>
</tr>
</tbody>
</table>
and this css
#calendar {
-moz-border-radius-bottomleft:6px;
-moz-border-radius-bottomright:6px; padding:15px;
clear:both; padding:15px;
}
body {
color:#222222;
font-family:sans-serif;
font-size:12px;
}
table {
border:1px
solid white;
border-collapse:collapse;
margin:0 0 30px;
width:100%;
}
.border {
border:1px solid #333134;
}
thead tr {
background:none repeat scroll 0 0 #B7EBFF;
color:#333134;
font-size:24px;
font-weight:bold; }
tr {
background:none repeat scroll 0 0 #616062;
font-size:16px;
}
thead td {
font-family:"Century Gothic",Arial;
padding:5px 0 20px 5px;
}
tr.border thead tr {
color:#333134; font-size:24px;
font-weight:bold;
}
tr {
font-size:16px;
}
