ParentNodeを使用してtr要素を取得する方法

前提・実現したいこと

質問失礼します。
現在Todoリストを作成しておりますが、JavascriptでCSSのdisuplay="none"を用いて
要素の表示/非表示を行いたいと考えております。

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

現状エラーメッセージは出ないのですが、
・タスクの状態ボタンを完了にし、チェックボックスを作業中にすると完了ボタンを消すことはできるが、タスク全体は消えない。

const doneParent = a.target.parentNode;
          doneParent.className = 'workDone';
        } else {
          createButton.textContent = "作業中";
          const workParent = a.target.parentNode;
          workParent.className = 'work';

ここを現状はButton要素に対してのアプローチになっていますが、tr要素にアプローチ出来ればタスク全体を非表示にできるのではないかと考えています。
ParentNoedeを使用して以下の部分を書き換えれば解決できるのかな、という大凡の目処は立てているのですが、tr要素の取得方法で悩んでいます。

workTasks.style.display = "none";

もし解決方法ご存知の方おられたらご教示のほど宜しくお願い致します。

該当のソースコード

HTML
1<!DOCTYPE html>
2<html lang="ja">
3
4<head>
5  <meta charset="UTF-8">
6  <meta name="viewport" content="width=device-width, initial-scale=1.0">
7  <link rel="stylesheet" href="css/style.css">
8  <title>Todoリスト</title>
9</head>
10
11<body>
12  <h1>Todoリスト</h1>
13  <p>
14    <input type="radio" name="task" value="1" checked ="checked">全て
15    <input type="radio" id="radio-work" name="task" value="2">作業中
16    <input type="radio" id="radio-done" name="task" value="3">完了
17  </p>
18  <p></p>
19  <table>
20    <thead>
21      <th>ID</th>
22      <th>コメント</th>
23      <th>状態</th>
24      <th></th>
25    </thead>
26    <tbody class="addTask-target" id="tbody"></tbody>
27  </table>
28  <h2>新規タスクの追加</h2>
29  <input class="addTask-value" type="text" />
30  <button class="addTask-trigger" type="button">追加</button>
31  <script src="js/main.js"></script>
32</body>
33
34</html>

Javascript
1
2{
3  document.addEventListener('DOMContentLoaded', () => {
4    const addTaskTrigger = document.getElementsByClassName('addTask-trigger')[0];
5    const addTaskTarget = document.getElementsByClassName('addTask-target')[0];
6    const addTaskValue = document.getElementsByClassName('addTask-value')[0];
7    const radioWork = document.getElementById('radio-work'); 
8    const radioDone = document.getElementById('radio-done');
9    let nextId = 0;
10    const todos = [];
11
12    //Taskとidを作成
13    const addTask = (task, id, tableItem) => {
14      const idSpanTd = document.createElement('td');
15      const taskSpanTd = document.createElement('td');
16      //タスク追加時にtodosにtodoを追加 
17      const todo = {
18        task: 'taskSpanTd',
19        status: '作業中'
20      };
21      todos.push(todo);
22      //要素内のHTML文章を変更する
23      idSpanTd.innerText = id;
24      taskSpanTd.innerText = task;
25      //生成したテーブル要素をブラウザに表示する
26      tableItem.append(idSpanTd);
27      tableItem.append(taskSpanTd);
28      addTaskTarget.append(tableItem);
29    };
30
31    //Button要素を生成する
32    const addButton = (tableItem, removeButton, createButton) => {
33      const createButtonTd = document.createElement('td');
34      const removeButtonTd = document.createElement('td');
35      //要素内のHTML文章を変更する
36      createButton.innerText = '作業中';
37      removeButton.innerText = '削除';
38      //生成したテーブル要素をブラウザに表示する
39      tableItem.append(createButtonTd);
40      tableItem.append(removeButtonTd);
41      addTaskTarget.append(tableItem);
42      //生成したbutton要素を生成する
43      createButtonTd.append(createButton);
44      removeButtonTd.append(removeButton);
45    };
46
47    //追加ボタンをクリックした際にtd要素を追加する処理を行う
48    addTaskTrigger.addEventListener('click', () => {
49      const task = addTaskValue.value;
50      const tableItem = document.createElement('tr');
51      const removeButton = document.createElement('button');
52      const createButton = document.createElement('button');
53      addTask(task, nextId++, tableItem);
54      addButton(tableItem, removeButton, createButton);
55      addTaskValue.value = '';
56      // //削除ボタンを押した時にタスクを削除する
57      const deleteElement = (a) => {
58        const tableTag = a.target.closest('tr');
59        if (tableTag) tableTag.remove();
60        updateId();
61      }
62      removeButton.addEventListener('click', deleteElement, false);
63
64      //ボタンを押したら作業中、完了中と変わる
65      createButton.addEventListener('click', (a) => {
66        if (createButton.textContent === "作業中") {
67          createButton.textContent = "完了";
68          const doneParent = a.target.parentNode;
69          doneParent.className = 'workDone';/*完了class*/
70        } else {
71          createButton.textContent = "作業中";
72          const workParent = a.target.parentNode;
73          workParent.className = 'work';/*作業中class*/
74        }
75      });
76    })
77
78    /*ラジオボタン作業中を押下時の処理*/
79    radioDone.addEventListener('click', function () {
80      const workTasks = document.getElementsByTagName('tr');
81      workTasks = Array.from(workTasks);
82      if (radioWork.checked === true) {
83        workTasks.forEach(function (workTasks) {
84          workTasks.style.display = "";
85        })
86      } else {
87        workTasks.forEach(function (workTasks) {
88          workTasks.style.display = "none";
89        })
90      }
91    })
92
93    // ラジオボタン完了押下時処理
94    radioWork.addEventListener('click', function () {
95      const doneTasks = document.getElementsByTagName('tr');
96      doneTasks = Array.from(doneTasks);
97      if (radioDone.checked === true) {
98        doneTasks.forEach(function (doneTasks) {
99          doneTasks.style.display = "";
100        })
101      } else {
102        doneTasks.forEach(function (doneTasks) {
103        doneTasks.style.display = "none";
104        })
105      }
106    })
107
108    //　連番　再振り直し
109    const updateId = () => {
110      const tbody = document.getElementsByTagName("tbody")[0];
111      const taskList = tbody.getElementsByTagName('tr');
112      nextId = 0;
113      Array.from(taskList, tr => {
114        tr.getElementsByTagName('td')[0].textContent = nextId;
115        nextId++
116      });
117    }
118  });
119}