Backbone.js. I can not find an error in the script

Just starting to learn the framework and javascript. The task is to create a one-page application with 10 squares. The peculiarity is that everyone should have a unique description in CSS.

Trying to solve with the use of 10 templat'ov. But the script does not start. Code:

alert ("script entry");

$(function () { blocks = [ {number: "1", state: "block1" }, {number: "2", state: "block2" }, {number: "3", state: "block3" }, {number: "4", state: "block4" }, {number: "5", state: "block5" }, {number: "6", state: "block6" }, {number: "7", state: "block7" }, {number: "8", state: "block8" }, {number: "9", state: "block9" }, {number: "10", state: "block10" }, ]; var BlockModel = Backbone.Model.extend({ defaults:{ "state": "block1", "number": "1" } }); var BlockCollection = Backbone.Collection.extend({ model: BlockModel, }); var blockNumbers = new BlockCollection([ model:BlockModel ]); var BlockView = Backbone.View.extend({ tagName: "blockTag", className: "blockClass", templates: { // шаблоны каждого квадратика "block1": _.template($('#block1').html()), "block2": _.template($('#block2').html()), "block3": _.template($('#block3').html()), "block4": _.template($('#block4').html()), "block5": _.template($('#block5').html()), "block6": _.template($('#block6').html()), "block7": _.template($('#block7').html()), "block8": _.template($('#block8').html()), "block9": _.template($('#block9').html()), "block10": _.template($('#block10').html()) }, render: function () { var state= this.model.get("state"); var tmpl = this.templates(state); $(this.el).html(tmpl(this.model.toJSON())); return this; } }); var appView = Backbone.View.extend({ el: $("#block"), initialize: function(){ this.collection = new blockNumbers(blocks); this.render(); }, render: function(){ _.each(this.collection.models, function (this.model) { that.renderBlock(this.model); }, this); }, renderBlock: function (inputModel) { var blockView = new BlockView({ model: inputModel }); this.$el.append(blockView.render().el); } }); var app = new appView(); 

});

Index File:

<div id = "block">

 <script type="text/template" id="block1"> <div class="block1"><%=number%></div> </script> <script type="text/template" id="block2"> <div class="block2"><%=number%></div> </script> <script type="text/template" id="block3"> <div class="block3">3</div> </script> <script type="text/template" id="block4"> <div class="block4">4</div> </script> <script type="text/template" id="block5"> <div class="block5">5</div> </script> <script type="text/template" id="block6"> <div class="block6">6</div> </script> <script type="text/template" id="block7"> <div class="block7">7</div> </script> <script type="text/template" id="block8"> <div class="block8">8</div> </script> <script type="text/template" id="block9"> <div class="block9">9</div> </script> <script type="text/template" id="block10"> <div class="block10">10</div> </script> 

</ div>

 <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript" src="underscore.js"></script> <script type="text/javascript" src="backbone.js"></script> <script type="text/javascript" src="script.js"></script> 

What am I doing wrong?