HTML ボタンのonclickでJSが動かない

前提・実現したいこと

TODOリストをつくりたいのですがボタンのonclickでJSが動かないのでつまずいてます
ボタンでやりたいことは(TODOの)追加と(フォームの)リセットです

該当のソースコード

HTML
1<!DOCTYPE html>
2<html>
3
4<head>
5  <meta lang="ja" charset="UTF-8">
6  <title>TODOリスト</title>
7  <link rel="stylesheet" type="text/css" href="todo.css">
8  <script type="text/javascript" src="todo.js"></script>
9</head>
10
11<body>
12  <h1>Hello, world!</h1>
13  <div class="Add_content" id="Add_content">
14    <input type="text" class="text_name" id="text_name">
15    <p class="month">月：
16      <select name="month" id="month">
17        <option value="-">-</option>
18        <option value="1">1月</option>
19        <option value="2">2月</option>
20        <option value="3">3月</option>
21        <option value="4">4月</option>
22        <option value="5">5月</option>
23        <option value="6">6月</option>
24        <option value="7">7月</option>
25        <option value="8">8月</option>
26        <option value="9">9月</option>
27        <option value="10">10月</option>
28        <option value="11">11月</option>
29        <option value="12">12月</option>
30      </select>
31    </p>
32    <p class="day">日：
33      <select name="day" id="day">
34        <option value="-">-</option>
35        <option value="1">1日</option>
36        <option value="2">2日</option>
37        <option value="3">3日</option>
38        <option value="4">4日</option>
39        <option value="5">5日</option>
40        <option value="6">6日</option>
41        <option value="7">7日</option>
42        <option value="8">8日</option>
43        <option value="9">9日</option>
44        <option value="10">10日</option>
45        <option value="11">11日</option>
46        <option value="12">12日</option>
47        <option value="13">13日</option>
48        <option value="14">14日</option>
49        <option value="15">15日</option>
50        <option value="16">16日</option>
51        <option value="17">17日</option>
52        <option value="18">18日</option>
53        <option value="19">19日</option>
54        <option value="20">20日</option>
55        <option value="21">21日</option>
56        <option value="22">22日</option>
57        <option value="23">23日</option>
58        <option value="24">24日</option>
59        <option value="25">25日</option>
60        <option value="26">26日</option>
61        <option value="27">27日</option>
62        <option value="28">28日</option>
63        <option value="29">29日</option>
64        <option value="30">30日</option>
65        <option value="31">31日</option>
66      </select>
67    </p>
68    <textarea name="text_detail" cols="50" rows="10" class="text_detail" id="text_detail"></textarea>
69ココです   <input type="submit" value="追加" class="Add_button" onclick="Add()">
70ココです   <input type="submit" value="リセット" class="clear_button" onclick="clear()">
71  </div>
72  <div class="list" id="list">
73    <script>content();</script>
74  </div>
75</body>
76
77</html>

Javascript
1var list=['English', 'Japanise'];
2
3function Add(){
4	list.push(text_name.value);
5}
6
7function clear(){
8  document.Add_content.text_name.value=""
9  document.Add_contert.text_detail.value=""
10  document.Add_content.month.value="-"
11  document.Add_content.day.value="-"
12}
13
14function content(){
15
16	for(var i = 0; i < list.length; i++){
17		document.write(list[i]+"<br>");
18	}
19}

最後に

説明不足なとこもあると思いますが
よろしくお願いします

行動規範の内容に同意します

回答1件

ベストアンサー

なにか根本的な勘違いをされているような気がします
一応参考までに

javascript
1var list=['English', 'Japanise'];
2function Add(){
3  list.push(document.querySelector('#text_name').value);
4  content();
5}
6function clear(){
7  document.Add_content.text_name.value=""
8  document.Add_contert.text_detail.value=""
9  document.Add_content.month.value="-"
10  document.Add_content.day.value="-"
11}
12function content(){
13  document.querySelector('#list').innerHTML="";
14  for(var i = 0; i < list.length; i++){
15    document.querySelector('#list').innerHTML+=list[i]+"<br>";
16    console.log(i);
17  }
18}
19window.addEventListener('DOMContentLoaded', function(e){
20  content();
21});

HTML
1<input type="text" class="text_name" id="text_name">
2    <p class="month">月：
3      <select name="month" id="month">
4        <option value="-">-</option>
5        <option value="1">1月</option>
6        <option value="2">2月</option>
7        <option value="3">3月</option>
8      </select>
9    </p>
10    <p class="day">日：
11      <select name="day" id="day">
12        <option value="-">-</option>
13        <option value="1">1日</option>
14        <option value="2">2日</option>
15        <option value="3">3日</option>
16      </select>
17    </p>
18    <textarea name="text_detail" cols="50" rows="10" class="text_detail" id="text_detail"></textarea>
19<input type="button" value="追加" class="Add_button" onclick="Add()">
20<input type="button" value="リセット" class="clear_button" onclick="clear()">
21</div>
22<div class="list" id="list"></div>
23