PDF出力のプログラムがうまく組めず困っています。

実現したいこと

・ミュージシャンが使うセットリストのPDF出力のプログラム

詳細

・html、Javascriptを用いて上記プログラムを作っています。
・当方就業未経験者です。
・バンド名、日付、曲目を入力して出力されるようなプログラムにしたいと思っています。

発生している問題

・PDF出力、曲を追加　をしてもボタンの反応がない状況（こちらは他言語でしたり、ライブラリを作る必要がありますでしょうか、、、）

該当のソースコード

html
1<!DOCTYPE html>
2<html lang="en">
3<head>
4    <meta charset="UTF-8">
5    <meta name="viewport" content="width=device-width, initial-scale=1.0">
6    <title>セットリスト作成</title>
7</head>
8<body>
9    <h1>バンドのセットリスト作成</h1>
10
11    <label for="bandName">バンド名:</label>
12    <input type="text" id="bandName">
13
14    <label for="date">日付:</label>
15    <input type="date" id="date">
16
17    <h2>セットリスト</h2>
18
19    <ol id="setlist">
20        <!-- セットリスト項目がここに追加されます -->
21    </ol>
22
23    <button onclick="addSong()">曲を追加</button>
24    <button onclick="generatePDF()">PDF出力</button>
25
26    <!-- jsPDFを使用する場合は、ライブラリを読み込む -->
27    <script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.4.0/jspdf.umd.min.js"></script>
28    <!-- JavaScriptファイルを読み込む -->
29    <script src="portfolio.js"></script>
30</body>
31</html>
32

js
1// セットリストの曲を追加する関数
2function addSong() {
3    const setlist = document.getElementById('setlist');
4    if (setlist.children.length < 20) {
5        const songNumber = setlist.children.length + 1;
6        const songName = prompt(`曲${songNumber}の名前を入力してください:`);
7        if (songName) {
8            const listItem = document.createElement('li');
9            listItem.textContent = songName;
10            setlist.appendChild(listItem);
11        }
12    } else {
13        alert('これ以上曲を追加できません。');
14    }
15}
16
17// PDFを生成する関数
18function generatePDF() {
19    const bandName = document.getElementById('bandName').value;
20    const date = document.getElementById('date').value;
21    const setlistItems = Array.from(document.getElementById('setlist').children)
22        .map(item => item.textContent);
23
24    // ここでPDFを生成するためのライブラリやサーバーサイドのエンドポイントを呼び出す処理が入ります
25    // 例えば、jsPDFを使用してクライアントサイドでPDFを生成する場合:
26    const pdf = new jsPDF();
27    pdf.text(`バンド名: ${bandName}`, 10, 10);
28    pdf.text(`日付: ${date}`, 10, 20);
29    pdf.text('セットリスト:', 10, 30);
30
31    setlistItems.forEach((item, index) => {
32        pdf.text(`${index + 1}. ${item}`, 10, 40 + index * 10);
33    });
34
35    pdf.save('setlist.pdf');
36}
37