CODEWITHSUNDEEP
javascripthtmldom
mpavlovic89
mpavlovic89

Reputation: 769

JavaScript onClick button adds textarea into particular div elements

I am obviously missing something. I need this addmore button to add textarea into the div for the particular question, not only the first one. I can make it complicate, but I hope there is an easy solution.

Fiddle

index.html

1.Question:<br/>
<textarea name="odg1" rows="1" cols="50" ></textarea><br/><div id="inner"></div><button type="button" name="addmore" onClick="addmore();">Add more</button>
<br/><br/>
2.Question:<br/>
<textarea name="odg2" rows="1" cols="50" ></textarea><br/><div id="inner"><button type="button" name="addmore" onClick="addmore();">Add more</button>
<br/><br/>

addmore.js

am = 1;
function addmore() {
        var textarea = document.createElement("textarea");
        textarea.name = "odg" + am;
        textarea.rows = 1;
        textarea.cols = 50;
        var div = document.createElement("div");
        div.innerHTML = textarea.outerHTML;
        document.getElementById("inner").appendChild(div);
        am++;
}

Upvotes: 0

Views: 1386

Answers (1)

Diodeus - James MacFarlane
Diodeus - James MacFarlane

Reputation: 114377

This function demonstrates how to generate more element using jQuery:

var am = 1;
function addmore() {
    var newText = $('<textarea />').attr('name','odg'+am).attr('rows',1).attr('cols',50);
    var newBtn = $('<button />').attr('onclick','addmore()').html('add more');
    $('body').append(newText);
    $('body').append('<br />');
    $('body').append(newBtn);
    am++;
}

Upvotes: 2

Related Questions