title: jQuery : Create new text box when the last textbox is filled
body: <p>I am building a form where the user can input the necessary tools to perform a task. I generate two input boxes for the user to have initially, but i want them to be able to have more inputs if necessary. I created a bit of jQuery that adds a new text box when the last text box is clicked, hinting that they may need another one. The code is as follows:</p>
  
  <pre><code>$( ".sidebar input:last-of-type" ).click(function(){
      $( ".sidebar input:last-of-type" ).after( '&lt;input type="text" placeholder="Tool Name" /&gt;' );
  });
  </code></pre>
  
  <p>This works, but it is only tied to the second text box that was generated initially. What I want to happen is if after the user adds additional tools, each time they click in the last, newly generated input, it will generate another one and so on. My guess is that the DOM still thinks that the second text box is the "last", although another one was added after the DOM was initially created. Is there a way to re-render the DOM or change my jQuery so that it ALWAYS selects the last input box?</p>