How do I make sure one function call happens after another

In my web application, there are two javascript functions submitJob and fetchJobs. I would like to call fetchJob in the end of submitJob so that the user can see the a new job has been created (this.jobs is connected to some display elements). Right now, the database is indeed updated, but there is no update on the front end (unless I refresh the web page). My javascript code looks like the following

submitJob: async function() {
  try {                                                                        
    let sel = document.getElementById('jobPriority')                           
    let priority = Number(sel.options[sel.selectedIndex].value);  
    let jobData = {'priority': priority, 'data': ''};                          
    let response = await axios.post('/api/jobs/', json=jobData,                
            {headers: {'Authorization': "Bearer " + this.token}});             
  } catch (error) { this.handleError(error); };                                
  this.fetchJobs();                                                     
},                                                                             
fetchJobs: async function() {                                           
  try {                                                                        
    let response = await axios.get('/api/jobs/',                               
            {headers: {'Authorization': "Bearer " + this.token}});             
    this.jobs = response.data;                                                 
  } catch (error) { this.handleError(error); };   
},

My suspicion is that fetchJobs is not called after the axios.post has returned. How do I guarantee that? I tried to place this.fetchJobs() inside the try statement and it doesn't work either.

update: according to the server log, there was not a GET request. Only a successful POST request. Not sure why that is so.

Thanks in advance for your help!