如何在JavaScript中向现有li元素添加文本（无新增ID/类限制）

直接替换原代码中的{{NEED to access the li and add a message}}部分为以下逻辑，即可实现需求：

// 获取目标ul元素
const targetUl = errorUl[0];
// 查询ul下的第一个li元素
let errorLi = targetUl.querySelector('li');
const fullErrorMessage = "The card has been declined for an unknown reason. Please contact support";

if (errorLi) {
    // 若li已存在，直接替换为完整提示文本（避免重复点击多次追加）
    errorLi.textContent = fullErrorMessage.trim();
} else {
    // 若li不存在，创建新li并添加到ul中
    errorLi = document.createElement('li');
    errorLi.textContent = fullErrorMessage;
    targetUl.appendChild(errorLi);
}

逻辑说明 #

• 先获取类名为woocommerce-error的第一个ul元素
• 查询该ul下是否存在li元素：
  • 存在的话，直接将其文本替换为完整的提示内容（防止重复点击导致文本重复追加）
  • 不存在的话，创建新的li元素，设置好提示文本后添加到ul中

内容的提问来源于stack exchange，提问作者dds sddssd