title: adding dynamically check boxes and use to show and hide content in knockout
body: <p>function that returns an object</p>
  
  <pre><code> function newParty(id,name,date){
      return {
              id:id,
              name:name,
              date:date,
              isVisible:ko.observable(false),
          }
      }
  </code></pre>
  
  <p>this is the html</p>
  
  <pre><code>&lt;div data-bind="foreach:$root.partyArray"&gt;
      &lt;p&gt;show me party: &lt;input type="checkbox" data-bind="checked: $data.isVisible" /&gt;&lt;/p&gt;
      &lt;div data-bind="visible: $data.isVisible"&gt;
           Date of party: "December
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>this my viewModel</p>
  
  <pre><code>var viewModel=function(){
      var self=this;
      self.partyArray=ko.observableArray([newParty('id','New York Party','now!!')])
  }
  </code></pre>
  
  <p>the problem is that when there are many parties, if i check one, it checks all the inputs</p>
  
  <p>how can i enumerate the parties???</p>