How to make the text and checkbox in my div bold and light grey depending on check status

I'm building a tables columns and rows with divs. For specific reasons and constructing it in Javascript like so

column.append('<div class="maRow"><label><input ' + IsChecked + ' type="checkbox" name="maCheckBox" data-parent=' + val.ParentID+ ' value=' + val.GroupNameID + '> ' + val.GroupName + '</label></div>');

Here is the rendered html for each row in the columns

<div class="maRow">
  <label>
    <input checked="" type="checkbox" name="maCheckBox" data-parent="0" value="21312">Some Text</label>
</div>

What do I need to do so that I can set checked checkboxes w/ text to bold (default) and unchecked checkboxes w/ their text to light grey and not bold?

It looks like the font-weight is 700 for each label, so how would I change that based on whether the checkbox is checked or not?