Событие клика не запускается в группе переключателей начальной загрузки

Я создаю переключатели динамически и используя функцию on(), пытаюсь захватить щелчок и что-то делать с ним.

Пока я пользовался радиокнопками, он работал нормально. Затем я инкапсулировал радиокнопки в разметке начальной загрузки, чтобы превратить ее в группу кнопок - теперь, когда я нажимаю кнопку, событие клика никогда не срабатывает. Не знаю, что мне не хватает!

Здесь код

разметка, сгенерированная динамически

 <div id="q_opt" class="btn-group" data-toggle="buttons">
        <label class="btn btn-default active" id="d_op_0"> <input id="q_op_0" name="op" type="radio" value="0">22%
    </label>
    <label class="btn btn-default" id="d_op_1"> <input id="q_op_1" name="op" type="radio" value="1">19%
    </label>
    <label class="btn btn-default" id="d_op_2"> <input id="q_op_2" name="op" type="radio" value="2">11%
    </label>
    <label class="btn btn-default" id="d_op_3"> <input id="q_op_3" name="op" type="radio" value="3">42%
    </label>
    <label class="btn btn-default" id="d_op_4"> <input id="q_op_4" name="op" type="radio" value="4">8%</label>
</div>

Здесь разметка, которая выбирает радио через селектор jQuery и проверяет, был ли нажат клик

$(document).on('click', 'input:radio[id^="q_op_"]', function(event) {
    alert("click fired");
}

Является ли bootstrap каким-то образом мешающим - или я пропустил какой-то шаг? Я смотрю на код, и мои глаза больше не ловят ошибку. Любая помощь/советы оценены!

(PS - переключатели преобразуются в красивую группу кнопок, кнопки нажимают и остаются нажатыми на тех, кто нажал и т.д., поэтому поведение кажется прекрасным, за исключением того, что клик не зарегистрирован на (..) )

Ответ 1

Вместо этого используйте обработчик изменений, потому что щелчок происходит на ярлыке

$(document).on('change', 'input:radio[id^="q_op_"]', function (event) {
    alert("click fired");
});

Демо: Fiddle

Ответ 2

У меня тоже был вызов. Но вместо того, чтобы помещать eventListeners на переключатели, я помещаю их на ярлык i.e.:

$('#d_op_1').on("click",function(){ 
   alert("click fired"); 
});