'Why is the input not being added to the list? [closed]

I am trying to make a simple to-do list, previously I got it working but now that I've tried adding a feature that checked if the input is empty - it is no longer working, clicking the add button does not do anything.

My code :

function addLi() {
  var li = document.createElement("li");
  var input = document.getElementById("TaskText").value;
  var txtNode = document.createTextNode(input);

  li.appendChild(txtNode);
  if (input === '') {
    alert("Must write a task!");
  } else {
    document.getElementById("list");appendChild(li)
  }
  document.getElementById("TaskText").value = "";
}
<body>

  <h1>Your To-Do List</h1>
  <label>Add a task to your list</label> <br>
  <input type="text" placeholder="Add task..." id="TaskText">
  <button onclick="addLi()" id="AddTask">Add</button>

  <ul id="list">
    <li>This is an example of a task!</li>
  </ul>

</body>


Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source