title: Give "x" on this.x a variable value when passing objects to an array
body: <p>I have seen in multiple questions on Stackoverflow, that I can pass a variable to a this keyword:</p>
  
  <pre><code>name = "world";
  alert("Hello " + this.name);
  </code></pre>
  
  <p>However, I am struggling with the following code:</p>
  
  <pre><code>$('.test').click(function() {
      var data = $(this).data();
      var type = data.type;
  
      $('#world-map-geo1').empty();
  
      $.getJSON('json/geoCountries-' + site + '.json', function (pushArray) {
          var countryData = [];
          console.log(type);
          $.each(pushArray, function() {
              // Following line doesn't make what I expect.
              countryData[this.countryIsoCode] = this.type;
              // alert(this.type)
          });
          console.log(countryData);
      });
  });
  </code></pre>
  
  <p>The function is executed once I click a li, f.i.:</p>
  
  <pre><code>&lt;li class="test" data-type="sessions"&gt;Sessions&lt;/li&gt;
  </code></pre>
  
  <p>I am getting undefined values, as this.type seems not being transformed as this.sessions. However, if I manually change this.type to this.sessions, it works correctly.</p>
  
  <p>I know it is not a problem of variable scope, as if I replace this.type for only type, I get "sessions" on every array object.</p>
  
  <p>I am totally sure, that the problem is my limited knowledge on jquery and how this keyword works for this particular approach, as althought I have not tried it, I believe that if I have an object named type inside my json, this.type would take those values instead of those in this.sessions.</p>