So I'm trying to insert an element into the list but the span keeps getting overwritten by the textcontent that I'm giving to li. This is what the code is supposed to look like:

```
<li class="togglable"><span class="plus-sgn">+</span> Add Task</li>

```

This is what I'm getting:

```
<li class="togglable">Add Task</li>

```

And here's the code:

```
  const togglable = document.createElement('li');
  const span = document.createElement('span');
  togglable.className = 'togglable';
  span.className = 'plus-sgn';
  span.textContent = '+';
  togglable.appendChild(span);
  togglable.textContent = 'Add Task';
  taskList.appendChild(togglable);

```