> For the complete documentation index, see [llms.txt](https://javascriptuse.gitbook.io/javascript/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://javascriptuse.gitbook.io/javascript/advanced/backbone.js-tutorial-13-collections-modifying-elements.md).

# Backbone.js Tutorial - 13 - (Collections) Modifying Elements

![](https://2726517656-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M1E4Gk2ppVKb4olmnun%2F-MS2HBKKViPI3SnropCb%2F-MS2K5Zd_Op8u7FWnd4x%2FScreenshot_7.jpg?alt=media\&token=eff2e26a-c5a9-4be9-9363-783e1556d748)

C:\Users\Administrator\Desktop\gulp\app.js

```
StudentModel = Backbone.Model.extend({
	defaults: {
		name: "unknown"
	}
});
StudentCollection = Backbone.Collection.extend({
	model: StudentModel,
	initialize: function () {

	}
});
jQuery(document).ready(function($) {
	var jony = new StudentModel({name: "Lionel1",id: 1});
	var vicky = new StudentModel({name: "Lionel2",id: 2});
	var studentGroup = new StudentCollection([jony, vicky]);
	displayCollectionContents("Before: ", studentGroup);
	var student = studentGroup.get(1);
	student.set({name: "Edit 1"});
	displayCollectionContents("After: ", studentGroup);
});
function displayCollectionContents(string, collection) {
	console.log(string + " " + JSON.stringify(collection.toJSON()));
}
```

![](https://2726517656-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-M1E4Gk2ppVKb4olmnun%2F-MS2KAqgxeOMzNeYylxq%2F-MS2KfZy3tEzES_kybG5%2FScreenshot_8.jpg?alt=media\&token=abaf6f4f-9e01-44d6-999b-67fe1da65987)

C:\Users\Administrator\Desktop\gulp\app.js

```
StudentModel = Backbone.Model.extend({
	defaults: {
		name: "unknown"
	}
});
StudentCollection = Backbone.Collection.extend({
	model: StudentModel,
	initialize: function () {

	}
});
jQuery(document).ready(function($) {
	var jony = new StudentModel({name: "Lionel1",id: 1});
	var vicky = new StudentModel({name: "Lionel2",id: 2});
	var studentGroup = new StudentCollection([jony, vicky]);
	displayCollectionContents("Before: ", studentGroup);
	var student = studentGroup.get(1);
	student.set({name: "Edit 1"});
	displayCollectionContents("After 1: ", studentGroup);
	vicky.set({name: "Edit 3"});
	displayCollectionContents("After 2: ", studentGroup);
});
function displayCollectionContents(string, collection) {
	console.log(string + " " + JSON.stringify(collection.toJSON()));
}
```
