title: StaleElementReferenceError: stale element reference: element is not attached to the page document is coming when I click on button
body: <p>I am following page object pattern in Protractor. In the following code I am matching the username and clicking on edit button</p>
  
  <pre><code>this.clickEditButton = function (userName) {        
      element.all(by.repeater('u in users')).each(function (elem) {
          elem.element(by.css('td:nth-child(1)')).getText().then(function (value) {                
              if (value == userName) {
                  elem.element(by.css("a[href*='#/organisation/editUser/31']")).click();
  
              }
          });
      });    
  };
  </code></pre>
  
  <p>The page open successfully but it is throwing " StaleElementReferenceError: stale element reference: element is not attached to the page document"  </p>
  
  <p>Main Method:</p>
  
  <pre><code>  userDirectoryPage.clickEditButton('EditUser1');            
    userEditPage.addBasicDetails('', 'Timon', 'Thompson', 'dummy1@abc', 'abc', 'abc', 'Testing');
  </code></pre>
  
  <p>Is anybody have some suggesstion how to fix this up?</p>