title: KnockoutJS checked binding with radio button
body: <p>I have a list of objects that I loop through and create radio button for them, then I would like to store the object that is selected in an observable, but I cant figure out how to do this. This fiddle is example of something that im trying to do: <a href="http://jsfiddle.net/whx96806/" rel="nofollow">jsfiddle.net/whx96806/</a> , but it doesn't work.</p>
  
  <pre><code> &lt;div data-bind="foreach: items"&gt;
  &lt;input type="radio" name="test" data-bind="checkedValue: $data, checked: $root.chosenItem" /&gt;
  &lt;span data-bind="text: itemName"&gt;&lt;/span&gt;
  &lt;/div&gt;
  &lt;div&gt;&lt;p&gt;You have selected: &lt;span data-bind="text:JSON.stringify(chosenItem())"&gt;&lt;/span&gt;&lt;/p&gt;&lt;/div&gt;
  &lt;button data-bind="click:print"&gt;Print&lt;/button&gt;
  </code></pre>
  
  <p>And the js code:</p>
  
  <pre><code>function ViewModel () {
      items= ko.observableArray([
      { itemName: 'Choice 1' },
      { itemName: 'Choice 2' }
      ]);
      chosenItem= ko.observable();
  
      print = function () { alert(chosenItem()); };
  
  };
  
  var vm = new ViewModel();
  ko.applyBindings(vm);
  </code></pre>