title: Remove last item of a list using javascript
body: <p>Hello I have a simple unordered list and I would like to remove the last item on click of a button. I read somewhere that pop(); will do this but I am having trouble getting it working.</p>
  
  <p>Here is what I have so far: </p>
  
  <pre><code>&lt;button id="remove"&gt;remove item&lt;/button&gt;
  
  &lt;ul id="list"&gt;
      &lt;li&gt;&lt;input type="text"&gt;&lt;/li&gt;
      &lt;li&gt;&lt;input type="text"&gt;&lt;/li&gt;
      &lt;li&gt;&lt;input type="text"&gt;&lt;/li&gt;
      &lt;li&gt;&lt;input type="text"&gt;&lt;/li&gt;
      &lt;li&gt;&lt;input type="text"&gt;&lt;/li&gt;
  &lt;/ul&gt;
  
  var listItems = document.getElementById("list").getElementsByTagName("li");
  var removeButton = document.getElementById("remove");
  
  removeButton.addEventListener("click", removeItem);
  
  function removeItem() {
      listItems.pop();
  }
  </code></pre>
  
  <p>Here is the error I'm getting:</p>
  
  <p>Uncaught TypeError: listItems.pop is not a function at HTMLButtonElement.removeItem</p>
  
  <p>Which is weird because when I type listItems in the console I am getting the correct array:</p>
  
  <p>listItems
  (7) [li, li, li, li, li, li, li]</p>
  
  <p><a href="https://jsfiddle.net/d1fwk8vp/" rel="nofollow noreferrer">jsfiddle</a></p>
  
  <p>Anyone have any suggestions? I dont need to use .pop() any method that works will be fine</p>