users should not be able to inject html

[bboyle]

Steps to reproduce:

1. visit the app: http://jtme.github.io/ToDolist/
2. add a new item: <span style="color: fuchsia;">hello</span>
3. observe that the html is added (the colour is applied)

Users would be able to interfere with the app through html injection (either malicious or accidental), for example entering </li> hello will close the list item and break the layout, and entering <script src="..."></script> can inject foreign script which will be executed.

[bboyle]

Review where the input is parsed: https://github.com/jtme/ToDolist/blob/gh-pages/script.js#L17
var add_value = $('input').val();

And inserted: https://github.com/jtme/ToDolist/blob/gh-pages/script.js#L18
var new_item = $("<li> <span class=\"item\">" + add_value + "</span></li>");

[bboyle]

I suggest something like this:

var user_input = $('input').val();
var clean_input = $('<div>').text(user_input).html();
var new_item = $("<li> <span class=\"item\">" + clean_input + "</span></li>");