How to add multiple input boxes with different names
<p>I am trying to make a button to add another input box every time it is clicked but I also want it to add an increasing number the end of the input name. I have this code to add more inputs.</p>

<pre><code>&lt;script type="text/javascript"&gt;
function addInput()
{
    var x = document.getElementById("inputs");
    x.innerHTML += "&lt;input type=\"file\" name=\"photo\" /&gt;";
}
&lt;/script&gt;
</code></pre>

<p>What can I do to make it so that every time a new form is added it will add a higher number to the end of name="photo" so that I can process images with my php script correctly?</p>

<p>default the form is:<br></p>

<pre><code> &lt;input type="file" name="photo"&gt;
</code></pre>

<p>but I would like to add a number to the end of photo every time a new input is made to have an output like this.</p>

<pre><code> &lt;input type="file" name="photo"&gt;
 &lt;input type="file" name="photo2"&gt;
 &lt;input type="file" name="photo3"&gt;
 &lt;input type="file" name="photo4"&gt;
</code></pre>

<p>etc</p>
