Javascript check bootstrap checkbox by id

I have the following form :

<form class="form-inline" role="form">
    <div class="col-xs-3">
        <div class="pic-container">
            <div class="checkbox">
                <label>
                    <input type="checkbox" name="discounting" onchange='handleChange(this);' id='check11' > Show only price-discounted products
                </label>
            </div>

        </div>
    </div>
    <div class="col-xs-3">
        <div class="pic-container">
            <div class="checkbox" id='check21'>
                <label>
                    <input type="checkbox" name="discounting" onchange='' id='check21'> Show only price-discounted products
                </label>
            </div>
        </div>
    </div>
</form>

I'd like to be able to check the second checkbox automatically with JavaScript once I check the first one. I tried using the following script :

<script>        
function handleChange(cb) {
    if(cb.checked == true) {
       alert('Message 1');  
       document.getElementById("check21").checked = true;
    } else {
       alert('Message 2');
       var x = document.getElementById("check21").disabled= false;
    }
}
</script>

But it doesn't work since I think with bootstrap is a question of classes.