Double variables in array and array output undefined

Question

When loop adds objects into array, i m getting double values within it

and when i want to call some object from array page its telling me its not defined (undefined), is there any possible way to make my object to increment per loop so it will be osoba, osoba1, osoba2 , can someone help me how to fix that,Thanks

class Osoba {
  constructor(id, firstName, surname, age, gender, friends) {
    this._id = id;
    this._firstName = firstName;
    this._surname = surname;
    this._age = age;
    this._gender = gender;
    this._friends = friends;
  }

  get id() {
    return this._id;
  }
  set id(id) {
    this._id = id;
  }
  get firstName() {
    return this._firstName;
  }
  set firstName(firstName) {
    this._firstName = firstName;
  }
  get surname() {
    return this._surname;
  }
  set surname(surname) {
    this._surname = surname;
  }
  get age() {
    return this._age;
  }
  set age(age) {
    this._age = age;
  }

  get gender() {
    return this._gender;
  }
  set gender(gender) {
    this._gender = gender;
  }

  get friends() {
    return this._friends;
  }
  set friends(friends) {
    this._friends = friends;
  }

}

var osobe = [];

$(function() {
  $.getJSON('https://raw.githubusercontent.com/Steffzz/damnz/master/data.json', function(data) {
    var json = jQuery.parseJSON(JSON.stringify(data));

    for (person of json) {

      var id = person['id'];
      var firstName = person['firstName'];
      var surname = person['surname'];
      var age = person['age'];
      var gender = person['gender'];
      var friends = person['friends'];

      var x = new Osoba(id, firstName, surname, age, gender, friends);
      osobe.push(x);
    }
    console.log(osobe);
  })
  document.write(osobe[0]);
});