title: JQuery: how to check if checkbox is checked and add attributes to field
body: <p>I'm trying to check whether a check box is checked, and if it is checked, then I want to add the "required" attribute to an adjacent text field.  I've tried it two different ways with no success.  Here are the form elements and my two JQuery attempts.</p>
  
  <p>neither of those will actually trigger the event.  My browser either does nothing at all or triggers an "Empty string passed to getElementById()." event</p>
  
  <p>Form elements:</p>
  
  <pre><code>  &lt;div class="col-sm-5"&gt;
              &lt;label id="checkboxNumber-label" class="toplabel" for="checkboxNumber"&gt;Checkbox&lt;/label&gt;
              &lt;g:textField name="checkboxNumber" value="${...checkboxNumber}" class="form-control" required="" aria-labelledby="checkboxNumber-label"/&gt;
              &lt;label class="checkbox-inline"&gt;
                  &lt;g:checkBox name="checkboxYesNo" id="checkboxYesNo" value="${...checkboxYesNo}" onclick="chkboxYesChecked()"/&gt; 
              &lt;/label&gt;
          &lt;/div&gt;
          &lt;div class="col-sm-5"&gt;
              &lt;label id="someTextField-label" class="toplabel" for="someTextField"&gt;Some Text Field Here&lt;/label&gt;
              &lt;g:textField name="someTextField" id="someTextField" value="${...someTextField}" class="form-control" aria-labelledby="someTextField-label"/&gt;
          &lt;/div&gt;
  </code></pre>
  
  <p>JQuery:</p>
  
  <pre><code>function chkboxYesChecked(){
          if($('#checkboxYesNo').prop('checked')){
              $('#someTextField').prop('required',true);
              $('#someTextField').append('&lt;span class="required-indicator"&gt;*&lt;/span&gt;');
          }else{
              $('#someTextField').removeAttr('required');
          }
             }
  
  
  $(document).ready(function() {    
      $('#checkboxYesNo').click(function() {
          if($(this).is(":checked"))
          {
              $('#someTextField').prop('required',true);
              $('#someTextField').append('&lt;span class="required-indicator"&gt;*&lt;/span&gt;');
          } else {
              $('#someTextField').removeAttr('required');
          }
      });
  });
  </code></pre>