How to show html tags from javascript variable to a div id?

Question

I want to show the testTag variable to the div after i click the button. When i clicked it only shows the label of the option tag and not the full select tags. Please help! This is my code.

function showDropdown() {
		
	var textTag = "<select>";
	var textOptions = ["option1","option2","option3"];
	
	for (i = 0; i < textOptions.length; i++) {
		textTag += '<options value="' + textOptions[i] + '">' + textOptions[i] + "</options>";
		
	}
	
	textTag += "</select>";
		
	document.getElementById("dropdownTest").innerHTML= textTag;
	console.log(textTag);
	}

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Show dropdown</title>
</head>

<body>
<input type="button" id="showDrop" value="Show dropdown" onClick="showDropdown()">
<div id="dropdownTest"></div>

</body>
</html>

I've voted to close this question because the issue is just a typo. — Scott Marcus
– Scott Marcus, Commented Jul 5, 2017 at 18:46

PeterMader · Accepted Answer · 2017-07-05 18:47:00Z

4

It's called <option>, not <options>:

function showDropdown() {	
    var textTag = "<select>";
    var textOptions = ["option1","option2","option3"];
	
    // declare "i"!
    for (var i = 0; i < textOptions.length; i++) {
        // change this line
        textTag += '<option value="' + textOptions[i] + '">' + textOptions[i] + "</option>";    		
    }
	
    textTag += "</select>";
		
    document.getElementById("dropdownTest").innerHTML = textTag;
    console.log(textTag);
}

<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Show dropdown</title>
  </head>
  <body>
    <input type="button" id="showDrop" value="Show dropdown" onClick="showDropdown()">
    <div id="dropdownTest"></div>
  </body>
</html>

edited Jul 5, 2017 at 18:47

answered Jul 5, 2017 at 18:43

PeterMader

7,3552 gold badges24 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

kreatusJohn Over a year ago

wow. im pulling my hair off. Im just starting to learn javascript. Thanks for the help!

Scott Marcus Over a year ago

@user3080440 Actually, that was an HTML error, not a JavaScript error.

Collectives™ on Stack Overflow

How to show html tags from javascript variable to a div id?

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related