How does todomvc Backbone's change to class 'editing' make todo editable?

Question

I'm going through Backbone tutorial and looking through the source code I don't understand the the doubleclicking event (todo-view.js), which leads to the edit method, which leads to the element getting the class 'editing' make the element (input) editable.

Answer 1

That is actually a CSS trick. The input element is hidden by default:

.todo-list li .edit {
    display: none;
}

Then on dblclick the parent li element receives the editing class, and that makes the input visible with another rule:

.todo-list li.editing .edit {
    display: block;
}