Unable to set checked attribute when checkbox clicked

I'm able to get all attribute of the clicked checkbox, but only cannot check it visibly.

$('body').off('click.checkbox').on('click.checkbox', '[data-checkbox]', function(event) {

    var id =  $(this).closest('[data-target]').attr('id');
    var target = $(event.target);

    if (target.is('input')) {

        if(target.is(":checked") == true) {

            console.debug($(this).find('input:checkbox').attr('id'));
            /*
                item-checkbox-1
                item-checkbox-2
            */

            //both below ways unable to check it
            $(this).find('input:checkbox').attr('checked', 'checked');
            $(this).find('input:checkbox').prop('checked', true);


           //but this checks all checkboxes found which is unintended
             find('input:checkbox').prop('checked', true);

            } else {

                //do smtg
            }

        } else {
            selectedItem.splice($.inArray(id, selectedItem),1);
        }
    }

});

This is how the checkbox looks like, and its unable to check on the checkbox clicked:

HTML:

<div class="item-checkbox" data-checkbox>
    <div class="checkbox">
        <input type="checkbox" id="item-checkbox-2">
        <label for="item-checkbox-2"></label>
    </div>
</div>