یک صفحه ساده بسازید که شامل یک فیلد متن و دکمه افزودن و یک لیست (ul) باشد؛ با نوشتن متن و زدن دکمه، یک آیتم جدید به لیست اضافه شود و با کلیک روی هر آیتم آن آیتم حذف گردد.

یک فرم HTML ساده با input و دکمه و یک عنصر ul درست کنید، سپس با JavaScript از متدهایی مثل document.querySelector یا getElementById و addEventListener استفاده کنید: هنگام ارسال فرم با event.preventDefault() مقدار input را با trim() بررسی کنید، عنصر li جدید با document.createElement('li') بسازید، متن را به textContent یا innerText اختصاص دهید و با appendChild به ul اضافه کنید و ورودی را خالی کنید. برای حذف آیتم‌ها می‌توانید هنگام ایجاد هر li یک listener برای رویداد click اضافه کنید یا از event delegation روی خودِ ul استفاده کنید و با event.target.remove() یا parentNode.removeChild(event.target) عنصر کلیک‌شده را حذف کنید. همچنین کنترل کنید که مقدار ورودی خالی نباشد و از classList برای اضافه‌کردن کلاس‌های استایل در صورت نیاز بهره ببرید.