ember arrays holding global state?

I'm trying to do something that i think should be dead simple. I have two models, Person and Job. A Person has many Jobs. I'm not using ember data so i'm just extending Ember.Object to create the Person and Job "classes". I'm justing using a plain 'ol array to hold the person's jobs.

If I create two people and I add a different Job to each, when I render their jobs, they both have the same jobs. I have no idea why or what the proper way to do this is.

See this fiddle.

App.Person = Ember.Object.extend({
  name: null,
  jobs: []
});

App.Job = Ember.Object.extend({
  name: null
});

App.IndexRoute = Ember.Route.extend({
  model: function() {
    var john = App.Person.create({name: "John Doe"});
    var rake = App.Job.create({name: "Rake leaves."});
    john.get('jobs').pushObject(rake);

    var jane = App.Person.create({name: "Jane Doe"});
    var washCar = App.Job.create({name: "Wash car."});
    jane.get('jobs').pushObject(washCar);

    // For some reason both john and jane have the same two jobs now. 
    // They should have one each.

    return [john, jane];
  }
});