You may do this :
<p onclick='myfunction("myThing")'> Click this new text for input box below </p>
<script>
function myfunction(id){
document.getElementById(id).innerHTML='<input type="text"/>';
}
</script>
Note that you may also make the whole thing simpler : simply not use any id but let the function find the next element :
<p onclick='myfunction(this)'> Click this text for input box below </p>
<b>input box appears .. ta daa</b>
<p onclick='myfunction(this)'> Click this new text for input box below </p>
<div> but no input box appears here, the line above must turn this text into a textbox, but it doesn't because of similar id, how do i fix the id problem without defining a new id over and over?</div>
<script>
function myfunction(element){
do {
element = element.nextSibling;
} while (element && element.nodeType != 1);
element.innerHTML='<input type="text"/>';
}
</script>
1
solved Call a Javascript function multiple times with the same HTML ID