javascript - 将图标设置为将插入事件的元素

Question

获取此页面，https://jsfiddle.net/twpn01Lz/ 。这是一个图书馆。

我正在尝试找到一种方法，以便在有人选择单选按钮时添加勾号图标或 X 图标。

目前，我可以获取单选按钮的值并在 JS 中使用它，但我不知道如何使用该值的图标。我正在寻找一种在 JS 中替换它的方法，但找不到，而且我也在寻找一种直接在 HTML 中更改它的方法，但没有成功。

function addBookToList(book) {
 const list = document.querySelector('#book-list');
 const row = document.createElement('tr');

 row.innerHTML = `
      <td>${book.name}</td>
      <td>${book.author}</td>
      <td>${book.pages}</td>
      <td>${book.read}</td>
      <td>
        <a href = '#' class='delete'> 
          <i class="fas fa-trash-alt delete">
          </I>
        </a>
      </td>
    `
 list.appendChild(row);
}

Answer 1

你的意思是

https://jsfiddle.net/mplungjan/yx4k6thw/

let read = document.querySelector('#radio1').checked ? "✔":"𝗫";

或者也许

let readIt = document.querySelector('#radio1').checked;
let read = `<i class="fas fa-${readIt?"check":"times"}"></i>`;