title: How to render an array as a list of radio buttons?
body: <p>I would like to loop through an array that I define in my Javascript and render a list of radio buttons. My code which isn't working currently, and it is as follows (also on <a href="http://jsfiddle.net/mnahlovsky/eHzyS/2/" rel="nofollow">jsfiddle</a>):</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div data-bind="foreach: options" &gt;
      &lt;div&gt;
          &lt;input type="radio" name="optionsGroup" data-bind="checked: selected" /&gt;
          &lt;span data-bind="text: label"&gt;&lt;/span&gt;
       &lt;/div&gt;    
  &lt;/div&gt;
  </code></pre>
  
  <pre class="lang-javascript prettyprint-override"><code>var optionsList = [
      {"value": "a","label": "apple"},
      {"value": "b","label": "banana"},
      {"value": "c","label": "carrot"}
  ];
  function viewModel() {
      var self = this;
      self.options = optionsList;
      self.selected = ko.observable("a");
      self.selected.subscribe(function(newValue) {
          alert("new value is " + newValue);
      });
  }
  ko.applyBindings(new viewModel());
  </code></pre>
  
  <p>If my array is part of the html then it works fine, see this (or <a href="http://jsfiddle.net/mnahlovsky/eHzyS/" rel="nofollow">jsfiddle</a>):</p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;div&gt;
      &lt;input type="radio" name="optionsGroup" value="a" data-bind="checked: selected"     /&gt;Apple
  &lt;/div&gt;
  &lt;div&gt;
      &lt;input type="radio" name="optionsGroup" value="b" data-bind="checked: selected" /&gt;Banana
  &lt;/div&gt;
  &lt;div&gt;
       &lt;input type="radio" name="optionsGroup" value="c" data-bind="checked: selected" /&gt;Carrot
  &lt;/div&gt;
  &lt;div data-bind="text: selected"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <pre class="lang-javascript prettyprint-override"><code>function viewModel() {
      var self = this;
      self.selected = ko.observable("a");
      self.selected.subscribe(function(newValue) {
          alert("new value is " + newValue);
      });
  }    
  ko.applyBindings(new viewModel());
  </code></pre>
  
  <p>I got this to work by generating the all of the html within my javascript and have this working using checkboxes, but am stumped generating a group of radiobuttons using the foreach iterator.  </p>
  
  <p>Has anyone gotten an example like my first one to work?</p>