JSFiddle - React, Tailwind, and code Playground

HTML

<div class="col-md-6 col-sm-4 col-xs-12" data-toggle="buttons" id="26Panel">
<div class="col-md-6">
<label class="btn btn-chackbox checkbox-lable-styles active" style="margin-bottom: 5px;">
<span class="glyphicon glyphicon-ok glyphicon-white"></span><input type="radio" name="SltOptionPane" value="27" id="27" autocomplete="off"><text>&nbsp;&nbsp;&nbsp;طبيعي</text>
</label>
</div>
<div class="col-md-6"><label class="btn btn-chackbox checkbox-lable-styles" style="margin-bottom: 5px;">
<span class="glyphicon glyphicon-ok glyphicon-white"></span><input type="radio" name="SltOptionPane" value="29" id="29" autocomplete="off"><text>&nbsp;&nbsp;&nbsp;ضعيف</text>
</label>
</div>
</div>

<div class="col-md-6 col-sm-4 col-xs-12" data-toggle="buttons" id="27Panel">
<div class="col-md-6">
<label class="btn btn-chackbox checkbox-lable-styles active" style="margin-bottom: 5px;">
<span class="glyphicon glyphicon-ok glyphicon-white"></span><input type="radio" name="SltOptionPane" value="30" id="30" autocomplete="off"><text>&nbsp;&nbsp;&nbsp;طبيعي</text>
</label>
</div>
<div class="col-md-6"><label class="btn btn-chackbox checkbox-lable-styles" style="margin-bottom: 5px;">
<span class="glyphicon glyphicon-ok glyphicon-white"></span><input type="radio" name="SltOptionPane" value="31" id="31" autocomplete="off"><text>&nbsp;&nbsp;&nbsp;ضعيف</text>
</label>
</div>
</div>

JavaScript

$(document).on('click', 'input', function(){
	alert(this.id);
});