How to check checkbox on change of another checkbox?

i want to check a checkbox when user check checkbox in parent li.

so here is my html code.

<ul>
  <li class="parent3 child2" id="3"><span style="padding-left:60px;"><i aria-hidden="true" class="icon-minus"></i>Civil</span><div>
                        <label class="viewList"><input type="checkbox" value="49" name="view[]">View</label>
                        <label class="downList"><input type="checkbox" value="49" name="down[]">Download</label>
                        <label class="upList"><input type="checkbox" value="49" name="update[]">Update</label>
                        </div><ul class="submenu" style="display: block;"><li class=" child3" id="4"><span style="padding-left:80px;">test1</span><div>
                        <label class="viewList"><input type="checkbox" value="60" name="view[]">View</label>
                        <label class="downList"><input type="checkbox" value="60" name="down[]">Download</label>
                        <label class="upList"><input type="checkbox" value="60" name="update[]">Update</label>
                        </div></li></ul></li>
</ul>

now i want to check the checkbox of child checkbox.

so i have tried following code.

$(document).ready(function(){
    $('.viewList input').change(function () {
alert('hello')
            if ($(this).attr("checked")) {
                $(this).closest('li').children('.submenu .viewList input').prop( "checked", true );
                alert('hello')
            }
            // not checked
        }); 
});

also here is the jsfiddle where also i had tried.

Any help will appreciated. Thanks