JavaScriptのcloneNodeで複製したものの子要素のクラスを操作したい

Question

前提・実現したいこと

JavaScriptのcloneNodeで複製したものの子要素のクラスを操作したい

<div class="original">
    <div class="class1">
    </div>
</div>

const original2 = document.getElementsByClassName("original1")[0].clone();
original2.getElemntsByClassName("class1").className = "class2";
document.getElementsByClassName("original2").appendChild(original2);

としたときに

<div class="original">
    <div class="class1">
    </div>
    <div class="original">
        <div class="class2">
        </div>
    </div>
</div>

となって欲しい

発生している問題・エラーメッセージ

JavaScriptの3行目で次のようなエラーが出る

TypeError: document.getElementsByClassName(...)[0] is undefined

試したこと

cloneNodeではなくimportNodeを利用しても同じになってしまう

const original = document.getElementsByClassName("original")[0];
const clone = document.importNode(original, true);
clone.getElemntsByClassName("class1").className = "class2";
original.appendChild(clone);

全く同じエラーが出る

補足情報（FW/ツールのバージョンなど）

Firefox 最新版

Answer 1

こんなかんじでしょうか

Comments

[yambejp]

<script>
window.addEventListener('DOMContentLoaded', ()=>{
var n=document.querySelector('.original').cloneNode(true);
n.querySelector('.class1').classList.add('class2');
n.querySelector('.class1').classList.remove('class1');
document.querySelector('.original').appendChild(n);
});
</script>
<div class="original">
<div class="class1">
</div>
</div>