title: knockout push not updating GUI
body: <p>I am struggeling with knockout and getting the UI too update when i add an item to an observableArray. The intial listing and deleteEmployee are working fine and update the UI appropriatley but when i try to add an employee the the UI is simply not updated. Below is the viewmodel and the html. Appreciate any help i can get on this. 
      <br>
      <br>
  <strong>ViewModel:</strong></p>
  
  <pre><code>function viewModel() {
          var self = this;
          self.employees = ko.observableArray();
  
          self.deleteEmployee = function () {
              var employee = this;
              dataservice.del(this.id, function () {
                  self.employees.remove(employee);
              })
          },
  
          self.addEmployee = function () {
              var emp = {};
              emp.Name = $("#newName").val();
              emp.Email = $("#newEmail").val();
              dataservice.add(emp, function (data) {
                  var employee = new Employee(data.id, emp.Name, emp.Email);
                  self.employees.push(employee);
              });
          }.bind(self);
  
          $.each(data.rows, function (index, row) {
              self.employees.push(new Employee(row.value.Id, row.value.Name, row.value.Email));
          });
  
          return {
              employees: self.employees,
              deleteEmployee: self.deleteEmployee,
              addEmployee: self.addEmployee
          }
      };
  
      ko.applyBindings(new viewModel());
  </code></pre>
  
  <p><br><br>
  <strong>Html</strong></p>
  
  <pre><code>&lt;article data-bind="foreach: employees"&gt;
                  &lt;div class="emp"&gt;
                      &lt;div class="empTop"&gt;
                          &lt;span data-bind="text: name"&gt;&lt;/span&gt;
                          &lt;div class="del" data-bind="click: $parent.deleteEmployee, clickBubble: false"&gt;&lt;/div&gt;
                      &lt;/div&gt;
                      &lt;div class="empContent"&gt;
                          &lt;div class="row"&gt;
                              &lt;label for="name"&gt;Name&lt;/label&gt;
                              &lt;input name="name" type="text" data-bind="value: name"&gt;
                          &lt;/div&gt;
                          &lt;div class="row"&gt;
                              &lt;label for="name"&gt;Email&lt;/label&gt;
                              &lt;input name="email" type="text" data-bind="value: email"&gt;
                          &lt;/div&gt;
                          &lt;div class="row"&gt;
                              &lt;input type="button" value="Update"&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;                 
              &lt;/article&gt;
  
              &lt;aside&gt;
                  &lt;h3&gt;Create&lt;/h3&gt;
                  &lt;div&gt;
                      &lt;div class="row"&gt;
                          &lt;label for="newName"&gt;Name&lt;/label&gt;
                          &lt;input id="newName" name="newName" type="text"&gt;
                      &lt;/div&gt;
                      &lt;div class="row"&gt;
                          &lt;label for="newEmail"&gt;Email&lt;/label&gt;
                          &lt;input id="newEmail" name="newEmail" type="text"&gt;
                      &lt;/div&gt;
                      &lt;div class="row"&gt;
                          &lt;input type="button" value="Create" data-bind="click: addEmployee"&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/aside&gt;
  </code></pre>