i have the following code in html, js and css.\[code\]<html> <head> <script type="text/javascript"> function add() { for(var j=0;j<4;j++){ var i = document.getElementById( 'old' ); var d = document.createElement( 'div' ); d.id = "new1"; d.innerHTML = i.innerHTML ; var p = document.getElementById('new'); p.appendChild(d); } } </script> </head> <body> <div id="old" style="visibility:hidden;"> <select> <option value="http://stackoverflow.com/questions/13737383/pls">Please</option> <option value="http://stackoverflow.com/questions/13737383/1"><</option> <option value="http://stackoverflow.com/questions/13737383/2">></option> <option value="http://stackoverflow.com/questions/13737383/3">=</option> </select> <input type="text" value=""/> </div> <hr/> <div id="new" style="visibility:hidden;"> <input type="button" value="http://stackoverflow.com/questions/13737383/go"/> </div> <hr/> <button onclick="add();">Add</button><br> </body> </html>\[/code\]Here i am trying to display dynamic div on click of add button. it is adding simply, but the div is visible by default, so i am hiding it through css style=" hidden". now on click of add button it is adding but the div is hidden.Here i am facing a problem how to show the div (here looping i.e 4). And the go button will come below of it.Also I am using css like ternary operator. e.g.el.style.visibility = (el.style.visibility == "hidden") ? "visible" : "hidden";
adding dynamic div to another div in javascript
- Thread starter MatiasM
- Start date