createElementで生成したliタグに内にチェックボックスを設置したい

前提

Vanila JSを用いて、簡単なtodoリストを作成している。inputタグに入力された内容をulタグ内にliタグとして生成する指定をおこなっている。

実現したいこと

inputタグに入力された内容をliタグで生成する指定までは、実現した。ここに生成されたliタグ内にチェックボックスを設置したい。

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

チェックボックスが出現しない。原因がわからないため、対処できない。

該当のソースコード

--HTML--
<div class="container">
      <h1 class="text__color">TODO</h1>
      <form action="#" id="form" class="form__width">
        <input
          type="text"
          id="input"
          placeholder="TODOを入力"
          autocomplete="off"
        />
      </form>
      <ul id="ul" class="list__group text__sec"></ul>
    </div>
--HTML--

--CSS--
body {
  height: 100vh;
  background-color: #efeeee;
}

.container {
  width: 100%;
  margin: 0 auto;
}

.text__color {
  color: rgb(98, 246, 244);
  font-weight: bold;
  padding: 50px 0;
  font-size: 40px;
  text-align: center;
}

.form__width {
  max-width: 200px;
  width: 100%;
  margin: 0 auto;
}

.list__group-item { 
    background-color: #fff;
    width: 80%;
    margin: 2% auto;
    border: 1px solid #000;
    padding: 16px 40px;
}
--CSS--

--JavaScript--
$(function () {
  const form = document.getElementById('form');
  const input = document.getElementById('input');
  const ul = document.getElementById('ul');
  const todos = JSON.parse(localStorage.getItem('todos')); //ローカルストレージからデータを取り出す指定

  if (todos) {
    //取り出したデータをli要素を生成する関数に代入
    todos.forEach((todo) => {
      add(todo);
    });
  }

  form.addEventListener('submit', (event) => {
    event.preventDefault(); //ホームでenter押すとリロードされる

    add();
  });

  function add(todo) {
    let todoText = input.value;

    if (todo) {
      todoText = todo;
    }

    if (todoText) {
      //空白の内容を送られても、エラー回避
      const li = document.createElement('li');
      const check = input.setAttribute('type', 'checked');
      li.innerText = todoText;
      li.classList.add('list__group-item');

      li.addEventListener('contextmenu', (event) => {
        event.preventDefault();
        li.remove();
        saveDate();
      });

      li.addEventListener('click', () => {
        li.classList.toggle('text__decoration-line-thought');
      });

      ul.appendChild(li, check);

      input.value = '';
      input.focus;

      saveDate();
    }
  }

  function saveDate() {
    const lists = document.querySelectorAll('li');
    let todos = [];
    lists.forEach((list) => {
      todos.push(list.innerText); //空白の配列にまとめる
    });
    localStorage.setItem('todos', JSON.stringify(todos)); //ローカルストレージにデータを保存
  }
});

--JavaScript--