ColinTheRobot/jsbin.liwixixi.css

## jsbin.liwixixi.css
h1 {
  color: red
}

## jsbin.liwixixi.html
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery-git.js"></script>
<script src="http://jashkenas.github.io/underscore/underscore-min.js"></script>
<script src="http://jashkenas.github.io/backbone/backbone-min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
</head>

<body>
  <div id="main">
  </div>

</body>
</html>

## jsbin.liwixixi.js
// Class View < Backbone::View

var View = Backbone.View.extend({
  el: "#main",

  // gets called on instantiation
  initialize: function(){
    this.render();
  },

  render: function(){
    // $(this.el).html("<h1>Hi</h1>");
    this.$el.html('<h1>Hi</h1><input type="text">');
  },

  events: {
  // model "event selector" : "callback"
    "click h1" : "colorMeBad",
    "dblclick h1" : "colorMeGreen",
    // this blur when you move out of sckope of input send alert
    "blur input" : function(){alert('blur');}
  },

  colorMeBad: function(){
    this.$('h1').css({background: "blue"});
    // $(this.el).find("h1").css({background: "blue"});
  },

  colorMeGreen: function(){
  $(this.el).find("h1").css({background: "green"});
  }

});

// Instantiate
$(document).ready(function(){
  view = new View();
});
	<!DOCTYPE html>
	<html>
	<head>
	<script src="http://code.jquery.com/jquery-git.js"></script>
	<script src="http://jashkenas.github.io/underscore/underscore-min.js"></script>
	<script src="http://jashkenas.github.io/backbone/backbone-min.js"></script>
	<meta charset="utf-8">
	<title>JS Bin</title>
	</head>

	<body>
	<div id="main">
	</div>

	</body>
	</html>
	// Class View < Backbone::View

	var View = Backbone.View.extend({
	el: "#main",

	// gets called on instantiation
	initialize: function(){
	this.render();
	},

	render: function(){
	// $(this.el).html("<h1>Hi</h1>");
	this.$el.html('<h1>Hi</h1><input type="text">');
	},

	events: {
	// model "event selector" : "callback"
	"click h1" : "colorMeBad",
	"dblclick h1" : "colorMeGreen",
	// this blur when you move out of sckope of input send alert
	"blur input" : function(){alert('blur');}
	},

	colorMeBad: function(){
	this.$('h1').css({background: "blue"});
	// $(this.el).find("h1").css({background: "blue"});
	},

	colorMeGreen: function(){
	$(this.el).find("h1").css({background: "green"});
	}

	});

	// Instantiate
	$(document).ready(function(){
	view = new View();
	});