How to implement “select all” check box using js in HTML?

It can be implemented as follows…

<input id="my_selectall" style="box-shadow: 0px 0px 0 0; width: auto;" onclick="mycheck()" type="checkbox" /> Sl No.
<input style="box-shadow: 0px 0px 0 0; width: auto;" type="checkbox" name="case" value="1" /> 1
<input style="box-shadow: 0px 0px 0 0; width: auto;" type="checkbox" name="case" value="2" /> 2
<input style="box-shadow: 0px 0px 0 0; width: auto;" type="checkbox" name="case" value="3" /> 3
<input style="box-shadow: 0px 0px 0 0; width: auto;" type="checkbox" name="case" value="4" /> 4
<script type="text/javascript">
    function mycheck() {
        var source=document.getElementById('my_selectall');
        checkboxes = document.getElementsByName('case');
        for(var i=0, n=checkboxes.length;i<n;i++) {
            checkboxes[i].checked = source.checked;
        }
    }
</script>