title: HTML element appears undefined inside ajax function
body: <p>I have an html that contains this:</p>
  
  <pre><code>&lt;a class="dropdown-toggle" data-toggle="dropdown" id="welcomeMessage"&gt;
      &lt;i class="oi oi-person"&gt;&lt;/i&gt; 
      Welcome, 
      &lt;i class="oi oi-chevron-bottom"&gt;&lt;/i&gt;
      &lt;span id="not_var"&gt;&lt;i id="not_env"&gt;&lt;/i&gt;&lt;/span&gt;
  &lt;/a&gt;
  </code></pre>
  
  <p>And a jQuery code like this:</p>
  
  <pre><code>$(document).ready(function(){
   var username;
  function getUserName(whenDone) {
      $.ajax( {
          url : '../scripts/getUser.php', type : 'get', data : {
          }
          , success : function (response) {
              whenDone(response);
          }
      }
      );
  }
  
  //When our ajax function finishes searching for the username, let's add it to the variable
  function onComplete(response) {
      username = response;
      $('#welcomeMessage').append(username);
  }
  //Get the username
  getUserName(onComplete);
  });
  </code></pre>
  
  <p>Inside the function <strong>onComplete</strong>, the element <strong>$('#welcomeMessage')</strong> is undefined. It is also undefined inside the <strong>success</strong> of the ajax call. And if I try to set said element's HTML after <strong>getUserName(onComplete);</strong> it results that the variable '<strong>username</strong>' is undefined.</p>
  
  <p>What I want is to be able to edit the HTML element with ID "welcomeMessage" with the content of the variable "username" once ajax is done. I used callbacks, but it looks like everything dissappears inside both: the success function and the callback one. As if those functions execute themselves isolated from the HTML and even the other content inside the <strong>$(document).ready</strong> block.</p>
  
  <p>Is there anyway to append to the <strong>$('#welcomeMessage')</strong> the value of '<strong>username</strong>' once the ajax is done fetching the data? That is, by making it available inside the function <strong>onComplete</strong>?</p>