Javascript ReferenceError:未定义searchData

如何定义此函数？在这几行中，我遇到了第18行的问题。该错误是一个ReferenceError，表示未定义“searchData”，我需要在哪里定义它

const searchbox = document.querySelector(".search-box");
const searchBtn = document.querySelector(".search-icon");
const cancelBtn = document.querySelector(".cancel-icon");
const searchInput = document.querySelector("input");
searchBtn.onclick = () => {
    searchbox.classList.add("active");
    searchBtn.classList.add("active");
    searchInput.classList.add("active");
    searchData.classList.add("activate");
    cancelBtn.classList.add("active");
    searchInput.focus();
    if (searchInput.value != "") {
        var values = searchInput.value;
        searchData.classList.remove("active");
        searchData.innerHTML = "You just typed " +
            "<span style='font-weight: 500;'>" + values + "</span>";
    } 
    else{
        searchData.textcontent = "";
    }
}
cancelBtn.onclick = () => {
    searchBox.classList.remove("active");
    searchBtn.classList.ramove("active");
    searchInput.classList.remove("active");
    cancelBtn.classList.remove("active");
    searchData.classList.toggle("active");
    searchInput.value = "";
}

const searchbox=document.querySelector（“.searchbox”）；
const searchBtn=document.querySelector（“搜索图标”）；
const cancelBtn=document.querySelector（“取消图标”）；
const searchInput=document.querySelector（“输入”）；
searchBtn.onclick=（）=>{
searchbox.classList.add（“活动”）；
searchBtn.classList.add（“活动”）；
searchInput.classList.add（“活动”）；
searchData.classList.add（“激活”）；
cancelBtn.classList.add（“活动”）；
searchInput.focus（）；
如果（searchInput.value！=“”）{
var值=searchInput.value；
searchData.classList.remove（“活动”）；
searchData.innerHTML=“您刚刚键入”+
“+值+”；
} 
否则{
searchData.textcontent=“”；
}
}
cancelBtn.onclick=（）=>{
searchBox.classList.remove（“活动”）；
searchBtn.classList.ramove（“活动”）；
searchInput.classList.remove（“活动”）；
取消btn.classList.remove（“活动”）；
searchData.classList.toggle（“活动”）；
searchInput.value=“”；
}

您尚未定义“searchData”，正在使用它。这就是它给你的错误。在使用之前定义它。