diff --git a/src/js/popup.js b/src/js/popup.js
index e5c159e..f819310 100644
--- a/src/js/popup.js
+++ b/src/js/popup.js
@@ -1041,17 +1041,37 @@ Logic.registerPanel(P_CONTAINER_INFO, {
const fragment = document.createDocumentFragment();
for (let tab of tabs) { // eslint-disable-line prefer-const
const tr = document.createElement("tr");
- fragment.appendChild(tr);
tr.classList.add("menu-item", "hover-highlight", "keyboard-nav");
tr.setAttribute("tabindex", "0");
- tr.innerHTML = Utils.escaped`
-
-
-
-
- | `;
- tr.querySelector(".favicon").appendChild(Utils.createFavIconElement(tab.favIconUrl));
- tr.setAttribute("tabindex", "0");
+
+ // Create
+ const tdMenuItem = document.createElement("td");
+
+ // Create and set context via createFavIconElement()
+ const divFavIcon = document.createElement("div");
+ divFavIcon.classList.add("favicon");
+ divFavIcon.appendChild(Utils.createFavIconElement(tab.favIconUrl));
+
+ // Create
+ const spanMenuTruncateText = document.createElement("span");
+ spanMenuTruncateText.classList.add("truncate-text");
+ spanMenuTruncateText.classList.add("menu-text");
+ spanMenuTruncateText.textContent = tab.title;
+ spanMenuTruncateText.title = tab.url;
+
+ // Create
+ const imgTrashButton = document.createElement("img");
+ imgTrashButton.classList.add("trash-button");
+ imgTrashButton.src = "/img/close.svg";
+ imgTrashButton.id = tab.id;
+
+ // Append Children
+ // table > fragment > tr > td > divFavIcon | spanMenuTruncateText | imgTrashButton
+ tdMenuItem.appendChild(divFavIcon);
+ tdMenuItem.appendChild(spanMenuTruncateText);
+ tdMenuItem.appendChild(imgTrashButton);
+ tr.appendChild(tdMenuItem);
+ fragment.appendChild(tr);
table.appendChild(fragment);
// On click, we activate this tab. But only if this tab is active.
|