Checkbox Hide/Show Default Display

Checkbox Hide/Show Default Display

Assuming that a checkbox is initially unchecked, the following code works because the additional text is hidden, and when the checkbox is checked, the function if performed to show() it. However, what needs to be done if the checkbox may or may not be checked initially? Thanks.

  1. .additional{ display:none; }
  1. $('#add').change(function(){
        if($('#add').is(':checked')){
            $('.additional').show();
        } else{
            $('.additional').hide();
        }
    })





  1. <input type="checkbox" name="add" id="add"><label for="add">display more</label>
    <span class="additional">::more text::</span>