function solution() {
let cards=Array.from(document.getElementsByClassName("card"));
console.log(cards)
let addCard=cards[0];
let listCard=cards[1];
let sentCard=cards[2];
let disCard=cards[3];
let giftsListUl=listCard.querySelector('ul');
let sentListUl=sentCard.querySelector('ul');
let discListUl=disCard.querySelector('ul');
let addInput=addCard.querySelector('input');
console.log(addInput);
let addBtn=addCard.querySelector('button');
console.log(addBtn);
addBtn.addEventListener("click", addGift);
function addGift(e){
let parentDiv=e.target.parentNode;
console.log(parentDiv);
let inputField=parentDiv.querySelector('input')
console.log(inputField);
let giftName=inputField.value;
if (giftName.length>0){
let giftLi=document.createElement("li");
giftLi.className="gift";
giftLi.textContent=giftName;
let sendBtn=document.createElement("button");
sendBtn.id="sendButton";
sendBtn.textContent="Send";
sendBtn.addEventListener("click",sendGift);
giftLi.appendChild(sendBtn);
let discBtn=document.createElement("button");
discBtn.id="discardButton";
discBtn.textContent="Discard";
discBtn.addEventListener("click",discardGift)
giftLi.appendChild(discBtn);
giftsListUl.appendChild(giftLi);
sortUl(giftsListUl);
inputField.value="";
}
}
function sendGift(e){
console.log(e.target.parentNode);
let gn=e.target.parentNode.childNodes[0].textContent;
let sentLi=document.createElement('li');
sentLi.className="gift";
sentLi.textContent=gn;
sentListUl.appendChild(sentLi);
giftsListUl.removeChild(e.target.parentNode);
}
function discardGift(e){
console.log(e.target.parentNode);
let gn=e.target.parentNode.childNodes[0].textContent;
let discLi=document.createElement("li");
discLi.className="gift";
discLi.textContent=gn;
discListUl.appendChild(discLi);
giftsListUl.removeChild(e.target.parentNode);
}
function sortUl(ul){
let lis=Array.from(ul.querySelectorAll('li'));
let sortedLis=lis.sort((a,b)=>a.textContent.localeCompare(b.textContent));
ul.innerHtml="";
sortedLis.forEach(l=>ul.appendChild(l));
}
}