mercredi 23 septembre 2015

Changing a checkbox label in Javascript

I'm trying to change a checkbox label in Javascript. The site is Wordpress and the form is a plug in, so I have to use a snippet plug in to target the checkboxes.

In brief, when a session is full, the checkbox needs to be greyed out and the label text highlighted in red.

Here's the Javascript I'm using:

<script>
var mon1 = document.getElementById('Mondays_7_1_1');
mon1.disabled = true;
mon1.style.color = "red";</script>

and here's the source code of the page:

<div><input class="" type="checkbox"  name="Mondays[]" value="5.00-6.00pm: 4-6 year olds  FULL" id="Mondays_7_1_1" /> 5.00-6.00pm: 4-6 year olds  FULL<br><input class="" type="checkbox"  name="Mondays[]" value="6.00-7.00pm: 7-9 year olds" id="Mondays_7_1_2" /> 6.00-7.00pm: 7-9 year olds<br><input class="" type="checkbox"  name="Mondays[]" value="7.00-8.00pm: 10-14 year olds FULL" id="Mondays_7_1_3" /> 7.00-8.00pm: 10-14 year olds FULL</div><div style="font-weight: normal;color:red;" id="checkbox_Mondays_7_1"></div> <script>
var mon1 = document.getElementById('Mondays_7_1_1');
mon1.disabled = true;
mon1.style.color = "red";</script>

The greying of the box isn't a problem, but I can't change the font colour of the label. Does anyone know what the issue might be?




Aucun commentaire:

Enregistrer un commentaire