JSFiddle - React, Tailwind, and code Playground
HTML
<h2>This should show up</h2>
<h2>This should too</h2>
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<h2>Aaaand this</h2>
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<br>a
<h2>And so on ^_^</h2>
<div id='result'>Soo:</div>
JavaScript
function getData() {
// First, get a reference to your h2 tags
var h2s = document.getElementsByTagName('h2');
// then a reference to the div you want to put your select list
var resultDiv = document.getElementById('result');
// string concatenation is faster than creating nodes individually,
// so we create a select list with a placeholder here
var selectList = "<select>{0}</select>";
var options = "";
// cycle through your collection of h2 nodes
for(var iH2 = 0; iH2 < h2s.length; iH2++){
// get the content from the current h2
var content = h2s[iH2].innerHTML;
// add an option node with the content inserted to our options string
options += "<option>" + content + "</option>";
}
// replace the placeholder with the options string
selectList = selectList.replace("{0}",options);
// now add the hold select tag to the innerHTML of results
resultDiv.innerHTML = selectList;
}
getData();