async function solution() {

    try {
        const url = 'http://localhost:3030/jsonstore/advanced/articles/list  '
        const res = await fetch(url);
        const data = await res.json();
        console.log(data);
        data.forEach(info => {
            const getMoreInfo = addInfo(info._id);
            const divMainElement = document.createElement('div');
            divMainElement.innerHTML = `<div class="accordion">
        <div class="head">
        <span>${info.title}</span>
        <button class="button" id=${info._id}>More</button>
        </div>
        <div class="extra">
        <p>${getMoreInfo.content}</p>
        </div>
        </div>`
        document.querySelector('#main').appendChild(divMainElement)
        });

    }catch (error) {
        console.log('Server error!');
    }

}
    document.querySelector('#main').addEventListener('click', btnOptions)

    function btnOptions (ev) {
       if(ev.target.textContent == "More") {
           document.querySelector('.extra').style.display = "inline"
        ev.target.textContent = 'LESS'
       }
    }

    async function addInfo(id) {

        const url = `http://localhost:3030/jsonstore/advanced/articles/details/${id}`
        const res = await fetch(url);
        const data = await res.json();
        return data;
    }
solution();