title: Wait till await/async returns in Jquery
body: <p>I am new to await/async in Jquery. When I am trying to use it in my js file, It is getting executed, but not as expected.</p>
  
  <pre><code>async updateProduct (product) {
      product.travelers.forEach((traveler, travelerOrder) =&gt; this.updateProductwithPassengerName(traveler) )
      return product
  }
  
  
   async updateProductwithPassengerName (traveler) {
       const travelerId = traveler.profile_id;
       var body = await this.userServiceClient.request('/v2/users/' + travelerId  + '/info','GET')
       traveler.first_name = body.first_name
       traveler.last_name = body.last_name
  
       return traveler
     }
  
  
  async request (path, method, body) {
      const options = {
        method: method,
        body: body,
        headers: this.headers(),
        credentials: 'same-origin'
      }
      const response = await fetch(this.relativeUrl(path), options)
  
      if (!response.ok) {
        throw new HttpError('Technical error occured', response.status)
      }
      return response.json().catch(function () {
        throw new HttpError('No results found', response.status)
      })
    }
  </code></pre>
  
  <p>Those are the 3 functions. What is happening now is that </p>
  
  <blockquote>
    <p>traveler.first_name = body.first_name<br>
    traveler.last_name = body.last_name</p>
  </blockquote>
  
  <p>these are not setting in synchronous manner( after </p>
  
  <blockquote>
    <p>var body = await this.userServiceClient.request('/v2/users/' +
    travelerId  + '/info','GET')</p>
  </blockquote>
  
  <p>. These are executing after a quiet a long time. </p>
  
  <p>What I am doing here is that, for each traveler I am setting first_name and last_name. And updating the product object. Since this setting of values is happening after a long time, product object is getting updated later, by the time UI page renders. I want this setting values to happening before doing anything else in jquery.</p>
  
  <p>Looking for help</p>