title: How to Remove last inserted div in javascript?
body: <pre><code>&lt;div id="file"&gt;                                    
  &lt;input type="file" name="txtImage" multiple="multiple" class="upload" /&gt;  
  &lt;input type="text"  name="txtImageDesc" class="desc" /&gt; 
  &lt;/div&gt;      
  &lt;input type="button" value="Add" name="addButton" onclick="javascript: add_more();" /&gt;
  &lt;input type="button" value="Remove" name="removeButton" onclick="javascript: remove();" /&gt;  
  </code></pre>
  
  <p>The above is two button which add or remove div on its calls.I have a java script function which is adding a div in html on call which works perfect</p>
  
  <pre><code>function  add_more() 
  {
  var txt = " &lt;p&gt;&lt;label&gt;Upload Image&lt;/label&gt;&lt;input type=\"file\" name=\"txtImage[]\"&gt;&lt;/p&gt;   &lt;p&gt;
  &lt;label&gt;Image Description&lt;/label&gt;&lt;input type=\"text\" name=\"txtImageDesc[]\"&gt; &lt;/p&gt;";
   document.getElementById("file").innerHTML += txt;
  }
  </code></pre>
  
  <p>However i am using the same script(with modification) to remove the last inserted div in it but its removing the whole html in the div.Here is the code:</p>
  
  <pre><code>function  remove() {
  var txt = " &lt;p&gt;&lt;label&gt;Upload Image&lt;/label&gt;&lt;input type=\"file\" name=\"txtImage[]\"&gt;&lt;/p&gt;    
  &lt;p&gt;&lt;label&gt;Image Description&lt;/label&gt;&lt;input type=\"text\" name=\"txtImageDesc[]\"&gt; &lt;/p&gt;";
   document.getElementById("file").innerHTML -= txt;
   }
  </code></pre>
  
  <p>The output it generate is.I want the last div inserted to be remove on button click</p>
  
  <pre><code>NaN
  </code></pre>