我想通过js中的div类名称在网站上添加页面按钮

Question

我想通过js中的div类在网站上添加按钮。我尝试了以下代码

(function(){
//  alert("heyy");
function AddButton(){
var site=document.querySelector(".up-form-group");
var button = document.createElement("button");
button.innerHTML="Write cover letter";
button.id="cbutton";
button.type = "button";
site.appendChild(button);
console.log("added");
}
AddButton();
})();

append child不是一个函数．我还尝试了下面的代码

document.getElementsByClassName('up-form-group')[0].appendChild(button); 

但是错误保持不变。另一个错误来了:无法读取null属性(读取'appendChild')如果有人能帮我解决这个错误

Answer 1

<div class="up-form-group"></div>是不可访问的，当你调用函数我想。

window.addEventListener("DOMContentLoaded",run);    
function AddButton(){
var site=document.querySelector(".up-form-group");;
var button = document.createElement("button");
button.innerHTML="Write cover letter";
button.id="cbutton";
button.type = "button";
site.appendChild(button);
console.log("added");
}
function run(){
AddButton();
}

<div class="up-form-group"></div>