I’m trying to update an HTML element in my page based on what I get from a PHP function I’m calling through $.post. But when I execute the code for the first time, the response value is undefined. From then on, it returns the past response value.

So I assumed it’s because the AJAX code isn’t synced with the server code, or something like that. What would be the best way to handle this? Best I found on google was another thread asking the same question, but with a single unsatisfying answer.

Here’s my current JQuery code:

var data = { arg0: 'functionName', arg1: var1, arg2: var2, arg3: var3 };

  $.post('directory/functions.php', data, function(response) {
  if(response != "") {
      POSTresult = response;
  }else{
      alert('Error');
  }
});
  element.textContent = POSTresult;

As you can see, the response value gets attributed to POSTresult, and after the $.post function, the element’s text gets updated to the value of POSTresult.