title: How to save & reuse dynamic DOM-content later in test case
body: <p><strong>Scenario:</strong>
  We want to test E2E the price calculation of our online shop (selling custom made products). Therefore we configure the product within the user frontend and check the price on various steps (product page, cart, checkout etc.). When the order is placed the user is redirected to a success page that also shows the order number.</p>
  
  <p>After the order was placed we also want to check the price within the merchant backend based on the order number we got from the success page</p>
  
  <p>Thus we want to somehow store the oder number for later use in the backend.</p>
  
  <p>We want to test all this in one test case - although we know it is recommended to test at least frontend and backend in separate test cases.</p>
  
  <p><strong>Problem:</strong></p>
  
  <p>The following code works fine:</p>
  
  <pre><code>
  describe('Check prices on frontend and backend', () =&gt; {
  
      it("can calculate correct prices on frontend and backend", function(){
  
          cy.visit("https://www.example.com/product/")
  
          ...
  
          // on success-page
          cy.get('#ordernumber').invoke("text").as("orderNumber");
  
          // go to backend
          cy.visit('https://www.example.com/backend')
  
          ...
  
          cy.get('#order_table #ordernumberInput').then(($orderInput) =&gt; {
              this.orderNumber = this.orderNumber.trim()
              cy.wrap($orderInput).type(this.orderNumber)
          })
  
          ...
      })
  })
  </code></pre>
  
  <p>But as soon as we encapsulate some code within a function, it stops working with "this.orderNumber is undefined"</p>
  
  <pre><code>describe('Check prices on frontend and backend', () =&gt; {
  
      it("can calculate correct prices on frontend and backend", function(){
  
          cy.visit("https://www.example.com/product/")
  
          ...
  
          // on success-page
          cy.get('#ordernumber').invoke("text").as("orderNumber");
  
          // go to backend
          cy.visit('https://www.example.com/backend')
  
          ...
  
          function accessOrder() {
              ...
              cy.get('#order_table #ordernumberInput').then(($orderInput) =&gt; {
                  this.orderNumber = this.orderNumber.trim()
                  cy.wrap($orderInput).type(this.orderNumber)
              })
              ...
          }
  
          accessOrder();
          ...
      })
  })
  </code></pre>
  
  <p><strong>Questions:</strong></p>
  
  <p>1) How to fix this?</p>
  
  <p>2) Is there any other better solution for this?</p>
  
  <p>Thanks!</p>