Knockout.js: Toggling Visibility Of Dom Elements Using Radio Buttons

Knockout.js: Toggling Visibility Of Dom Elements Using Radio Buttons

I am new to KO and learning step by step.
I would like to toggle the DOM visibility based on chosen radio button
value. My code is not working as expected, kindly help....
HTML
<div>
Wanna see what is next?
<p><label><input type="radio" name="MyChoice" value="True"
data-bind="checked: MyChoiceValue" /> Yes</label>
<label><input type="radio" name="MyChoice" value="False"
data-bind="checked: MyChoiceValue" /> No</label></p>
</div>
<div data-bind="visible: isVisible">
<h1>Hello World !</h1>
</div>
and my Javascript
viewModel = function() {
var self = this;
self.isVisible: ko.observable(''),
self.MyChoiceValue: function() {
if(self.MyChoiceValue() === 'True') {
self.isVisible(true);
} else {
self.isVisible(false);
}
}
};
ko.applyBindings(new viewModel);
jsFiddle:
http://jsfiddle.net/gbhasha/tCQtp/5/