Tell us what’s happening:
the last test is failing
what’s wrong with the function, everything seems to be working
- When you click the #delete-bookmark-button, you should delete the bookmark corresponding to the selected radio button and appropriate category from the local storage and update the displayed bookmark list.
Your code so far
/* file: script.js */
const handleDelete = () => {
const bookmarks = getBookmarks();
const checked = document.querySelector('input[name="bookmarks"]:checked');
const filteredBookmarks = bookmarks.filter(
(bookmark) =>
bookmark.name !== checked.value && bookmark.category !== dropdown.value,
);
localStorage.setItem("bookmarks", JSON.stringify(filteredBookmarks));
const currentCategoryBookmarks = filteredBookmarks.filter(
(bookmark) => bookmark.category === dropdown.value,
);
if (currentCategoryBookmarks.length === 0) {
categoryList.innerHTML = "<p>No Bookmarks Found</p>";
} else {
categoryList.innerHTML = currentCategoryBookmarks
.map(
(bookmark) => `
<div>
<input type="radio" id="${bookmark.name}" name="bookmarks" value="${bookmark.name}">
<label for="${bookmark.name}"><a href="${bookmark.url}">${bookmark.name}</a></label>
</div>
`,
)
.join("");
}
};
deleteBookmark.addEventListener("click", handleDelete);
<!-- file: index.html -->
/* file: styles.css */
Your browser information:
User Agent is: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36
Challenge Information:
Build a Bookmark Manager App - Build a Bookmark Manager App