javascript: undefined variable
<p>my variable 'todoList' is showing up as undefined. i am very new to javascript and programming in general. any help would greatly be appreciated!</p>

<p><div class="snippet" data-lang="js" data-hide="false">
<div class="snippet-code">
<pre class="snippet-code-js lang-js prettyprint-override"><code>var todoList = {
  todos:[],
  displayTodos: function() {
    if (this.todos.length === 0) {
      console.log ('Your todos list is empty!');
    } else {
      console.log('My Todos:');
      for (var i = 0; i &lt; this.todos.length; i++) {
        if (this.todos[i].completed === true) {
          console.log ('(x)', this.todos[i].todoText);
        } else {
          console.log('( )', this.todos[i].todoText);
        }
      }
    }
  },
  addTodo: function(todoText) {
    this.todos.push({
      todoText: todoText,
      completed: false
    });
    this.displayTodos();
  },
  changeTodo: function(position, todoText) {
    this.todos[position].todoText = todoText;
    this.displayTodos();
  },
  deleteTodo: function(position) {
    this.todos.splice(position, 1);
    this.displayTodos();
  },
  toggleCompleted: function(position) {
    var todo = this.todos[position];
    todo.completed = !todo.completed;
    this.displayTodos();
  },
  toggleAll: function() {
    var totalTodos = this.todos.length;
    var completedTodos = 0;
    for (var i = 0; i &lt; totalTodos; i++) {
      if(this.todos[i].completed === true) {
        completedTodos++;
      }
    }
    if (completedTodos === totalTodos) {
      for(var i =0; i &lt; totalTodos; i++) {
        this.todos[i].completed === false;
      }
    }
    this.displayTodos;
  }
};</code></pre>
</div>
</div>
</p>