title: KO Computed not updating UI
body: <p>I am still fairly new to knockout and I am trying to display and hide bootstrap tabs using knockout. </p>
  
  <p>basically I have a computed observable:</p>
  
  <pre><code>self.isActive = ko.computed(function () {
              var selected = ko.utils.arrayFirst(self.padParticipant(), function (item) {
                  return item.ParticipationStatus == 'Active';
              });
              return selected !== null ? true : false;
          });
  </code></pre>
  
  <p>to update these tabs:</p>
  
  <pre><code>&lt;ul class="nav nav-tabs" id="padTabs"&gt;
          &lt;li data-bind="fadeVisible: !isActive()"&gt;&lt;a href="#joinPad"&gt;Join PAD&lt;/a&gt;&lt;/li&gt;
         &lt;li class="active"&gt;&lt;a href="#history"&gt;History&lt;/a&gt;&lt;/li&gt;
         &lt;li data-bind="fadeVisible: isActive()"&gt;&lt;a href="#update"&gt;Update Subscription&lt;/a&gt;&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>The computed is working correctly in the sense that when I refresh the page the correct tabs are hidden, but I need it to work without refreshing. </p>