X-List

A simple javascript ToDo list

by velo_ninja

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Project Management</title>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
    <style>
        .ui-tabs-panel {
            padding: 10px;
        }
        .ui-tabs-panel .accordion {
            margin-top: 10px;
        }
    </style>
</head>
<body>
    <div id="content">
        <button id="AddProject">Add Project</button>
        <section>
            <div id="tabs">
                <ul>
                    <li><a href="#project1">Project 1</a> <span class="ui-icon ui-icon-close">Remove Tab</span></li>
                </ul>
                <div id="project1">
                    <div class="accordion">
                        <div>
                            <h3><a href="#">Download jQuery UI</a></h3>
                            <div>
                                <input type="checkbox" class="completed"> <strong>Download jQuery UI</strong>
                                <div>
                                    Go to <a href="http://jqueryui.com/download">http://jqueryui.com/download</a> to download jQuery UI.
                                </div>
                                <div>
                                    <strong>Date due:</strong> 11/15/2011
                                </div>
                            </div>
                        </div>
                        <div>
                            <h3><a href="#">Build Theme for jQuery UI</a></h3>
                            <div>
                                <input type="checkbox" class="completed"> <strong>Build Theme for jQuery UI</strong> 
                                <div>
                                    Go to <a...