I have this inside my `<table>` and the naming inside my `addFields()` function does not seem to work... Does anyone know what alternative line of code do I need for this `document.getElementById('materials') += "<name='"+iteration2+"'>";`? 

HTML:

```
<td>
    <p id="addFields">
        <input type="number" required name="productquantity1" min="1" max="1000">
        <select name="productline1" id="materials">
            <option value="123">123</option>
        </select>
    </p>
</td>
<td valign="top">
    <button type="button" onclick="addFields();">+</button>
</td>

```

JavaScript:

```
    var counter = 2;
    function addFields() {
        var iteration2 = "productline" + counter;

        var select = document.getElementById('materials').cloneNode(true);
        document.getElementById('materials') += "<name='"+iteration2+"'>"; //does not work
        document.getElementById('addFields').appendChild(select);
        counter++;
    }

```