I am pretty new to js, and I am building a color scheme generator as a solo project.
I am now stuck on select the html element that created dynamically.
I tried to select both labels and inputs element below, using document.getElementByClassName but it gives me that element I selected ‘undefined’
Click to copy!
`
I wanna select multiple labels and multiple inputs elements and add a clickEvent so that user can copy the resultColor code from both label and input
function renderColor(){
//to store result of color scheme set object
resultColorDivHtml = resultColorSchemeSet.map((resultColorItem) => {
return `<div class="result-color" style="background-color: ${resultColorItem};"></div>`;
}).join('')
resultCodeDivHtml = resultColorSchemeSet
.map((resultColor) => {
return `
<label for='${resultColor}' class='copy-label'>Click to copy!</label>
<input class='result-code' id='${resultColor}' type="text" value='${resultColor}'/>`;
})
.join("");
resultColorDiv.innerHTML = resultColorDivHtml;
resultColorCodeDiv.innerHTML = resultCodeDivHtml;
}