یک صفحه HTML ساده بسازید که شامل یک کادر متن، یک دکمه «افزودن» و یک لیست نامرتب باشد؛ با جاوااسکریپت وقتی کاربر متن را وارد و دکمه را کلیک کرد یک آیتم جدید به لیست اضافه شود و هر آیتم لیست با کلیک روی خودش حذف شود.

با استفاده از HTML و جاوااسکریپت و روش‌های پایهٔ دستکاری DOM، عنصرهای ورودی، دکمه و لیست را با document.getElementById بگیرید، برای دکمه addEventListener قرار دهید که مقدار ورودی را خوانده (با trim برای جلوگیری از رشتهٔ خالی) و با createElement('li') و innerText یک عنصر لیست بسازد و با appendChild به ul اضافه کند؛ برای حذف هر آیتم می‌توانید به هر li هنگام ایجاد یک listener اضافه کنید یا از event delegation روی ul استفاده کنید و با element.remove() یا parent.removeChild حذف را انجام دهید. نکات: مقدار ورودی را پس از افزودن پاک کنید، از بررسی خالی بودن ورودی استفاده کنید و برای مدیریت بهتر از کلاس‌ها (classList) استفاده کنید.