index.html

<!DOCTYPE html>
<html>
<head>
  <script type="text/javascript" src="js/knockout-3.3.0.js"></script>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
  <link rel="stylesheet" type="text/css" href="css/main.css">
</head>
<body>
  <h1>Llama TODO, Lazy version</h1>
  <div class="llama-img"> </div>
  <div>
    <label>Task:<input data-bind="value: task, valueUpdate:'keypress' , event: { keypress: addTask}" type="text" placeholder="Add your task here!" autofocus /></label>
    <div data-bind="foreach: tasks">
      <div class="task">
        <span data-bind="text: name, css: { completedtask: completed }"> </span>
        <input type="checkbox" data-bind="checked: completed, event: { click: $root.markAsDone }"/> 
      </div>
    </div>
    <button class="btn" data-bind="click: removeTask">Clear completed</button>
    <button class="btn" data-bind="click: removeAll">Clear all</button>
  </div>

  <script type="text/javascript" src="build/bundle.js"></script>
</body>
</html>