title: Knockout JS throws "not a function" error from within foreach
body: <p>I'm facing the following issue with Knockout. I have a list set up that is populated with some values. This all works great and I get my dropdown items just fine. It also has a click function, that registers the value of what is being clicked. This works fine with a console.log but it absolutely refuses to update a KO observable that I set up. It ONLY screws up when it's inside the <code>&lt;ul&gt;</code>, if I move the <code>&lt;a&gt;</code> line in the HTML out of the <code>&lt;ul&gt;</code> to a different section of the page, it works without issues. Likewise, if I tell Javascript to update the "dropdownSelectedA3" value with something if a different button is clicked. I'm thinking it's looking in the wrong place or something but I can't seem to figure this out. </p>
  
  <p>Also tried:</p>
  
  <ul>
  <li>Changing "this.dropdownSelectedA3(answerUserA3)" to "viewmodel.dropdownSelectedA3(answerUserA3)" but same issue occurs</li>
  <li>Removing $parent also does not fix it, unfortunately</li>
  </ul>
  
  <p>Can someone perhaps point out my mistake?</p>
  
  <p>My code:</p>
  
  <p>Relevant HTML:</p>
  
  <pre><code>&lt;ul class="dropdown-menu" aria-labelledby="dropdownMenu3UL" data-bind="foreach: dropdownAnswersAssignment3"&gt;
           &lt;li&gt;
             &lt;a data-bind="text: $data, click: $parent.logAnswerA3" href="#"&gt;&lt;/a&gt;
           &lt;/li&gt;
          &lt;/ul&gt;
  </code></pre>
  
  <p>Relevant JS (in my viewmodel):</p>
  
  <pre><code>this.dropdownAnswersAssignment3 = ko.observableArray([C1M5OptionsActive.A3.option1, C1M5OptionsActive.A3.option2, C1M5OptionsActive.A3.option3, C1M5OptionsActive.A3.option4]);
  
  var answerUserA3
  
  this.dropdownSelectedA3 = ko.observable("...");
  
  this.logAnswerA3 = function(answer) {
      answerUserA3 = answer;
      this.dropdownSelectedA3(answerUserA3)
  }
  </code></pre>