Switch from <span> to <label> for the "Mark all as complete" text

todo-example/jquery/css/app.css

@@ -78,7 +78,7 @@ body {
 	border-bottom: none;
 }
 
-#todo-list li.done span {
+#todo-list li.done label {
 	color: #777777;
 	text-decoration: line-through;
 }
@@ -86,7 +86,7 @@ body {
 #todo-list li .destroy {
 	display: none;
 	position: absolute;
-	top: 16px;
+	top: 20px;
 	right: 10px;
 	cursor: pointer;
 	width: 20px;
@@ -119,7 +119,7 @@ body {
 	display: none;
 }
 
-#todo-list li .view span {
+#todo-list li .view label {
 	word-break: break-word;
 }
 

todo-example/jquery/index.html

@@ -32,7 +32,7 @@
 	<li {{#if done}}class="done"{{/if}} data-id="{{id}}">
 		<div class="view">
 			<input class="toggle" type="checkbox" {{#if done}}checked{{/if}}>
-			<span>{{title}}</span>
+			<label>{{title}}</label>
 			<a class="destroy"></a>
 		</div>
 		<input class="edit" type="text" value="{{title}}">