title: Problem with getting API data from url using jQuery
body: <p>I have a html form</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html lang="en"&gt;
  &lt;head&gt;
      &lt;meta charset="UTF-8"&gt;
      &lt;meta name="viewport" content="width=1.0, initial-scale=1.0"&gt;
      &lt;meta http-equiv="X-UA-Compatible" content="ie=edge"&gt;
      &lt;title&gt;Document&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;form id="formGIT"&gt;
          &lt;input type="text" name="GitHubUsername" id="GitHubUsername"&gt;
          &lt;input type="submit" value="Submit"&gt;
      &lt;/form&gt;
  
      &lt;script src="https://code.jquery.com/jquery-3.4.1.min.js"&gt;&lt;/script&gt;
      &lt;script src="scripts/app.js"&gt;&lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>In scripts/app.js what I want is to get the github-api data in a variable using jQuery. For that, I have tried,</p>
  
  <pre><code>var githubAPIMainStream = null;
  var url = null;
  
  $(document).ready(function(){
      $('#formGIT').on('submit', function(e){
          var githubusername = $('#GitHubUsername').val();
          url = 'https://api.github.com/users/'+githubusername;
  
          $.getJSON(url, function(data) {
              githubAPIMainStream = data;
          });
  
          alert(githubAPIMainStream);
      });
  });
  </code></pre>
  
  <p>But, what I am getting in the <strong>githubAPIMainStream</strong> variable is a null. It would be helpful, If someone tell me what is going wrong.</p>