I have multiple svg elements that I want to select to highlight. When I click the first time, I want the plot to highlight. When I click anywhere else on the page, I want to unselect. When I click another element while one is already selected. I want to unselect. I am having trouble determining if a mouse click is somewhere not on a selectable element. How would I set up an event listener to determine if I am selecting somewhere on the page that is not an element?
Right now my event listener on the document looks like this:
document.addEventListener("click", function(event) {
console.log(event.relatedTarget);
});
An help in the right direction would be greatly appreciated!