Помогите пожалуйста решить задачу. Использовать javascript

Задача 1. Динамическое создание и добавление элементов в корзину товаров
Вам нужно создать веб-приложение для интернет-магазина, где пользователь сможет добавлять товары в корзину. При нажатии на кнопку «Добавить в корзину» у соответствующего товара должна создаваться новая строка в корзине, содержащая информацию о нём. Для этого можно использовать document.querySelector, createElement, createTextNode, append, textContent, classList.add и событие onclick.

Для этого вам пригодится HTML-заготовка:

<h1>Каталог товаров</h1>
<ul id="product-list">
<li>
<span>Товар 1</span>
<button onclick="addToCart('Товар 1')">Добавить в корзину</button>
</li>
<li>
<span>Товар 2</span>
<button onclick="addToCart('Товар 2')">Добавить в корзину</button>
</li>
<li>
<span>Товар 3</span>
<button onclick="addToCart('Товар 3')">Добавить в корзину</button>
</li>
</ul>
<h2>Корзина</h2>
<ul id="cart">
</ul>


Пример работы программы

При нажатии на кнопку «Добавить в корзину» в блоке «Корзина», который находится ниже, должен появиться элемент списка «Товар» и номер товара, на который мы нажали.