title: selected object pattern with knockout
body: <p>Does anybody know how I'd accomplish the following pattern with knockoutJS?
  I use this pattern all the time in apache flex and want to see if I can mimic it.
  I am unsure how to replace an observable with another. Any help/thoughts much appreciated.</p>
  
  <p>//model</p>
  
  <pre><code>myViewModel = {
   items : ko.observableArray(),
   selected_item : ko.observable()
   }
  </code></pre>
  
  <p>//view</p>
  
  <pre><code>&lt;h3 data-bind="text : myViewModel.selected_item.name"&gt; &lt;/h3&gt;
  &lt;ul&gt;
  &lt;!-- ko foreach: myViewModel.items --&gt;
  &lt;li  data-bind="text : name"/&gt;
  &lt;!-- /ko --&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>//logic</p>
  
  <pre><code>$('li').click(function(e){
      //check ko.dataFor(this) has different id from that of myViewModel.selected_item
      //if id different
      //set myViewModel.selected_item to ko.dataFor(this)
      //rejoice as h3 text changes
   })
  </code></pre>