document.addEventListener("DOMContentLoaded", ()=>{
let template = document.querySelector(".template");
let button = document.querySelector(".button");
let screen = document.querySelector(".screen");
button.addEventListener("click", ()=>{
let template_clone = template.content.cloneNode(true);
template_clone.style.background = "red";
screen.appendChild(template_clone)
})})
I need to add an object to the screen that is a template clone and edit its style
<body>
<button class="send">send</button>
<div class="screen">
<template class="template">
<div class="box1"></div>
</template>
</div>
</body>
if I try to edit the template_clone.style style it results in an error
undefined is not an object (evaluating 'template_clone.style.background = "red"')