Dom HTML return elements twice

Question

am a newbie and am stuck with this for a week now, when I click the button to save the book information in session storage and post the book information in an other div, I get this result:the div is written twice, once with the css and the other without it, this my code:( for the whole code git@github.com:yaminecy/html.git)

` 
 //icons buttons
              let bookmark = '<a id="' + items[i].id + '" data-id="' + items[i].id + '" data-title="' + items[i].volumeInfo.title + '" data-description="' + items[i].volumeInfo.description + '" data-author ="' + items[i].volumeInfo.authors + '" data-image ="' + items[i].volumeInfo.imageLinks.smallThumbnail + '"><i id="bookmark" class="fas fa-bookmark fa-3x"></i></a>';
              let trashicon = '<a class="trash" id="' + items[i].id + '" onclick="return this.parentNode.remove();"><i id="icon2" class="fas fa-trash fa-3x"></i></a>';


              //add elements to the book.
              const livre = document.createElement("div");
              livre.innerHTML = '<div id= "livre">' + bookmark + title + id + author + selectdescription + image  + '</div>';
             capture.appendChild(livre);

              let bookmarkbutton = document.getElementById(items[i].id);
              //click bookmark button 
              bookmarkbutton.addEventListener('click', function () {
                var book = '{"id": "' + this.dataset.id + '", "name": "' + this.dataset.title + '", "description" : "' + this.dataset.description + '", "author" : "' + this.dataset.author + '", "image": "' + this.dataset.image + '"}';
                favori(book);
              });
                //create a function for the action click on the button "bookmark"
                function favori(item) {
                  console.log(item);
                  let pochList = [];
                  if (sessionStorage.getItem("maPochList") !== null) {
                    pochList = JSON.parse(sessionStorage.getItem("maPochList"));
                  }
  
                  if (pochList.includes(item)) {
                    alert("Vous ne pouvez pas ajouter deux fois le même livre!")
                  }
                  else {
                    pochList.push(item);
                    sessionStorage.setItem("maPochList", JSON.stringify(pochList));
                    item = JSON.parse(item);
                    favorite_books.append(setFavori(item)); 
                  }
                }

              // create a function that returns a div with information of favorite books
              let bookdiv = document.createElement("div");
              favorite_books.appendChild(bookdiv);
            
              function setFavori() {
               return bookdiv.innerHTML= '<div id= "livre">' + trashicon + title + id + author + selectdescription + image + '</div>';;
                }

              }
          }
        }
     ))
    }
  //Show Favorites
  let pochList = [];
  if (sessionStorage.getItem("maPochList") !== null) {
    pochList = JSON.parse(sessionStorage.getItem("maPochList"));
  }

  for (var k in pochList) {
    var item = JSON.parse(pochList[k]);
    bookdiv.append(setFavori(item));
  }
}    `