In Twitter Bootstrap 3 button (checkbox) remains gray after it is unchecked

I use Twitter Bootstrap 3 and have this code:

<div class="btn-group" id="day-group" data-toggle="buttons">
    <label class="btn btn-default">
        <input name="fruits" id="apple" value="1" type="checkbox" />Apple
    </label>
    <label class="btn btn-default">
        <input name="fruits" id="orange" value="2" type="checkbox" />Orange
    </label>
</div>

I click on the "Apple" and that button (checkbox) is gray. It is checked now.

Then I click on the "Apple" again. It is unchecked now. But it is still gray. Only if I click somewhere else it will be white, so I can see, that checkbox is unchecked.

I want to see white button (checkbox) right after it is unchecked, without having to click somewhere else. How could I achieve that? jQuery, css or other ways?