Izdihar - Magic Kingdom Escapology

This is just a short test of the Prism code rendering plugin written by Lea Verou. For some, as yet, inexplicable reason, it isn't applying the CSS as it should, hence the code being shades of brown, rather than the nice rainbow coloured stuff it ought to be.

Edit: So, problem solved. I'd used an incorrect piece of markup. Things are now as they should be.

/*
 *	- Add todos
 *	- Delete todos
 *
 *	## Further challenges
 *	- Mark as completed; styled with a strikethrough.
 *	- Mark all as completed
 *	- delete all todos
 *	- delete all completed todos.
 *	- Edit a todo. Inline editing.
 */

function makeTodo(text) {
  var $todo = $("<li></li>");
  var $button = $("<button>x</button>");
  $todo

    .text(text)
    .addClass("todo")
    .append($button);

  $button.on("click", function() {
    $(this).parent("li.todo").remove();
    // Or $todo.remove(;) as a more terse option
  });

  return $todo;
}

$("#save-button").on("click", function(e) {
  e.preventDefault();
  var input = $("#input-field").val();

  var $todo = makeTodo(input);
  $(".todo-list").append($todo);
  $("#input-field").val("").focus();
});


// (strings) Array of strings
// (string) Item in the array of strings

var strings = [
  "Foo",
  "Bar",
  "Baz"
];

strings.forEach(function(string) {
  var todo = makeTodo(string);
  $(".todo-list").append(todo);
})