Why is this hide not working?

Question

I am trying to follow this solution

I have this in my form;

       <div class="form-check">
            {!! Form::checkbox('yesPlease', 1, null, ['id' => 'yesCheck']) !!}
        </div>
        <div class="check-label">
        Yes please.
        </div>
        <div id="ifYes" style="display:none">
            <div class="form-check">
                {!! Form::checkbox('alsoYes', 1, null) !!}
            </div>
            <div class="check-label">
                Also yes.
            </div>
        </div>

and this in my script;

    <script type="text/javascript">

    function yesnoCheck() {
        if (document.getElementById('yesCheck').checked) {
            document.getElementById('ifYes').style.display = 'block';
        } else
            document.getElementById('ifYes').style.display = 'none';
        }

    </script>

However, when you select 'yesCheck', 'ifYes' does not get display:block.

Seems pretty simple, what am I missing? Thanks.