title: get.JSON with multiple URLs
body: <p>I am working with get.JSON right now to fetch data from the Foursquare API (venue_history to be exact, no authorisation needed). I am able to get json data from multiple URLs. I have been told the way I have done it is not a very effective way to do so, my colleague mentioned something about putting the URLs into an array and adding a counter so it parsed each URL separately? I want to use the data from each URL to visualise it (not at that stage yet, long way to go!). </p>
  
  <p>Here is my code:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  $(document).ready(function(){
    $("button").click(function(){
      $.getJSON('https://api.foursquare.com/v2/users/self/venuehistory?oauth_token=2ZO1PQOUAD5SXRAJOLZVH53RBQ1EB2C23FE2GUZLJYQUJ3SY&amp;v=20121108',
      function(data){
        console.log(data);
  
     $.getJSON('https://api.foursquare.com/v2/users/1050511?oauth_token=2ZO1PQOUAD5SXRAJOLZVH53RBQ1EB2C23FE2GUZLJYQUJ3SY&amp;v=20121109',
     function(data){
        console.log(data);
  
     $.getJSON('https://api.foursquare.com/v2/users/1050511?oauth_token=2ZO1PQOUAD5SXRAJOLZVH53RBQ1EB2C23FE2GUZLJYQUJ3SY&amp;v=20121109',
     function(data){
        console.log(data);
  
     $.getJSON('https://api.foursquare.com/v2/users/1050511?oauth_token=2ZO1PQOUAD5SXRAJOLZVH53RBQ1EB2C23FE2GUZLJYQUJ3SY&amp;v=20121109',
     function(data){
        console.log(data);
  
  
            });
          });
        });
      });
    });
  });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;button&gt;Send an HTTP POST request to a page and get the result back&lt;/button&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>My question is, how can I do this is in a more efficient way?</p>
  
  <p>Thanks very much!</p>
  
  <p>Here is my new code:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
  &lt;script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;script&gt;
  $(document).ready(function () {
    $("button").click(function GetJSONResult(url)
  {
    $.getJSON(url,
     function(data){
      console.log(data);
      });
  } 
  
  GetJSONResult('https://api.foursquare.com/v2/users/self/venuehistory?oauth_token=2ZO1PQOUAD5SXRAJOLZVH53RBQ1EB2C23FE2GUZLJYQUJ3SY&amp;v=20121108');
  GetJSONResult('https://api.foursquare.com/v2/users/self/venuehistory?oauth_token=2ZO1PQOUAD5SXRAJOLZVH53RBQ1EB2C23FE2GUZLJYQUJ3SY&amp;v=20121108');
  GetJSONResult('https://api.foursquare.com/v2/users/self/venuehistory?oauth_token=2ZO1PQOUAD5SXRAJOLZVH53RBQ1EB2C23FE2GUZLJYQUJ3SY&amp;v=20121108');
  GetJSONResult('https://api.foursquare.com/v2/users/self/venuehistory?oauth_token=2ZO1PQOUAD5SXRAJOLZVH53RBQ1EB2C23FE2GUZLJYQUJ3SY&amp;v=20121108');
  
  
  });
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  
  &lt;button&gt;Send an HTTP POST request to a page and get the result back&lt;/button&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>It keeps on saying "unexpected identifier", I believe this is because I put all the "GetJSONResult" in the wrong place. When it was at the bottom of the code not within the function it was telling me GetJSONResult was undefined? Any help appreciated.</p>