title: How to remove last element using jquery?
body: <p>Here I'm trying to create a calling pad that reads a maximum of 10 numbers at a time, and displays the numbers as a maximum of 6 numbers in a row. It's working functionally. I want to remove the last number when the user presses the clear button.</p>
  
  <p>I used <code>$("#calling-pad").last().remove();</code> to try to remove the last number, but it removes the whole contents and doesn't allow to enter a new number. How can I fix it?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>var key = 1;
  
  $("#nine").click(function(){
      if (p === 1) {
          $("#mini-screen").css("display","none");
          $("#number-screen").css("display","block");
          if (key &lt; 11) {
              if ((key % 7) !== 0) {
                  $("#calling-pad").append("9");
                  key = key + 1;
              }
              else {
                  $("#calling-pad").append("&lt;br&gt;");
                  $("#calling-pad").append("9"); 
                  key = key + 1;
              }
          }    
      } 
  });
  
  $("#inner-icon-one").click(function(){
      if (p === 1) {
          $("#mini-screen").css("display","none");
          $("#number-screen").css("display","block"); 
          if (key &gt; 1) {
              if ((key%6) !== 0) {
                  $("#calling-pad").last().remove();
                  key = key - 1;
  
                  if ( key === 1) {
                      $("#number-screen").css("display","none"); 
                      $("#mini-screen").css("display","block");   
                  }
              }
          }
      }
  });</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;span id="calling-pad"&gt; &lt;/span&gt;</code></pre>
  </div>
  </div>
  </p>