Check/Uncheck boxes

HTML:

<ol>
 <span>Select All<input id='selectall' type="checkbox" onclick='test(this.id);'>
            <ul>
        <span class='selectall'>1.<input type="checkbox" class='selectall'></span>
        <span class='selectall'>2.<input type="checkbox" class='selectall'></span>
        <span class='selectall'>3.<input type="checkbox" class='selectall'></span>
        <span class='selectall'>4.<input type="checkbox" class='selectall'></span>
        <span class='selectall'>5.<input type="checkbox" class='selectall'></span>
            </ul>
</span>

JS:

function test(clicked_id){
        if($("#" + clicked_id).prop("checked", true)){
            $('#' + clicked_id + ' .' + clicked_id).prop('checked', true);
        } else{
            $('#' + clicked_id + ' .' + clicked_id).prop('checked', false);
        }
}

http://ift.tt/2ez5yy6

I want to select my main-checbox and to have the other checkboxes checked as well, but I am doing something wrong. When I try to select my main-checkbox, nothing happens.