OnChange Event of Checkboxes in Angular

<div ng-app="my_app" ng-controller="my_ctrl">
<input type=checkbox ng-model="Python" ng-change="onChange()"> Python 
<input type=checkbox ng-model="Angular" ng-change="onChange()"> Angular
<input type=checkbox ng-model="JQuery" ng-change="onChange()"> JQuery
<br><br>
Python : {{Python}}, Angular : {{Angular}}, JQuery : {{JQuery}}
</div>
<div class='alert alert-primary' role='alert' id=d1>After the on
Change event details will appear here</div>
<script>
var app = angular.module('my_app', []);
app.controller('my_ctrl', function($scope) {
$scope.Python=false; // default status
$scope.Angular=true; // default status
$scope.JQuery=false; // default status	
$scope.onChange = function()
{
var str="<b>Python</b>:"+$scope.Python+",<b> Angular</b>:"
 + $scope.Angular + ",<b> JQuery</b>:" + $scope.JQuery 	
 document.getElementById('d1').innerHTML=str;
} 
    
});
</script>