It's reinventing what browsers can already do if you use an HTML link <a href="…"> so it's inefficient. It's also inaccessible.
* It's not in the focus order so you can't keyboard navigate to it. You have to add tabindex="0" to the div to correct that.
* It's not keyboard operable. You have to add not just a click listener but also a key press event listener and check that the key pressed is Enter.
* It has no role so a screen reader user doesn't know that it's a link. You have to add role="link" to it.
It's also missing useful user experience features of actual links
* You can hover a cursor over a real link to see the destination URL in the status bar.
* You can copy a real link's URL.
* You can use alternate clicks or a contextual menu to open a link destination in a new window.
Search engines can't find and index the destination of fake links.
HTML means HyperText Markup Language. HyperText means “documents linked to each other”. By not using <A> you’re skipping the core reason why HTML exists, as defined by its name.
The other comment explains pretty well what that causes in the browser.
Backend dev that dabbles in front end here. What’s the problem with this?