-----HTML-------
<p id="a"><span>This has a over highlight style and event 'click'.</span></p>
<p><a id="b" href="#">Click here to erase the click event in the last paragraph's inner span</a></p> 

------JS--------
// without event delegation -- works fine
$(function() {
	$("#b").click(function() {
		$("#a span").unbind("click");
		return false;
	});

	$("#a span").hover(
		function() {$(this).addClass("high");},
		function() {$(this).removeClass("high");}
	).click(function() {
		$(this).append(" He. ");
	});
});

// with event delegation - .die("click") kills all live events
$(function() {
	$("#b").live("click", function() {
		$("#a span").die("click");
		return false;
	});

	$("#a span")
	.live("mouseover", function() {$(this).addClass("high");})
	.live("mouseout", function() {$(this).removeClass("high");})
	.live("click", function() {$(this).append(" He. ");});
});