how do change html checkbox state in javascript?

html source :

'<div class="checkbox">' +
    '<label for="sn-checkbox-open-in-new-window">' +
    '<input type="checkbox" id="sn-checkbox-open-in-new-window" checked />' + lang.link.openInNewWindow +
    '</label>' +
    '</div>';

i find input checkout object this here.

var $openInNewWindow = self.$dialog.find('input[type=checkbox][id=sn-checkbox-open-in-new-window]');

var isChecked = linkInfo.isNewWindow !== undefined ?
        linkInfo.isNewWindow : context.options.linkTargetBlank;

    $openInNewWindow.prop('checked', isChecked);

When I do this, the checkbox does not change properly. The box is not painted or checked.

so

$openInNewWindow.on('click', function(event) {
        $openInNewWindow.val('checked').val(false);
        console.log($openInNewWindow.val('checked'));
        //$openInNewWindow.prop(':checked', !$openInNewWindow.prop(':checked'));
        //console.log($openInNewWindow.prop(':checked'));
      });

I changed the state when I clicked force, but it does not change.

how do change html checkbox state in javascript?

i think rendering block.

help me plz