Userscript to open Feedly article in new tab not working

Question

On the RSS site Feedly, clicking an article defaults to opening an on-page preview of the article. In order to open the full article in a new tab, the user must ctrl+click. I'm trying to write a simple userscript to automatically open a clicked article in a new tab, but I'm not experienced with combining JS and HTML.

This is an example of the outer HTML for one article:

 <article id="fLHFtwryZugkTI3NC4UrLqmHQcckXfXbVh1XRHy9YeE=_17e8e258822:19cca6e:c8b06589_main" class="entry entry--selected entry--unread u5 density-24" data-alternate-link="https://www.theguardian.com/science/2022/jan/24/james-webb-space-telescope-station-a-million-miles-from-earth" data-navigation="inline" data-inlineentryid="fLHFtwryZugkTI3NC4UrLqmHQcckXfXbVh1XRHy9YeE=_17e8e258822:19cca6e:c8b06589" data-u="5"> <div class="visual-container"> <div class="visual" style="background-image: url(&quot;https://lh3.googleusercontent.com/b4TTLa9CuY9dHVaGhVo4pjMIBcuVDJvreIiCjB-X3ier6g_MQmyF7ivmfXu0gsyN0w6JAQMVJ_Oy4q5gol3MYsRN7QsW8zVayHHWYhZn=s347&quot;);"></div> <div class="visual-overlay"></div> </div> <div class="content"><a class="link entry__title" href="https://www.theguardian.com/science/2022/jan/24/james-webb-space-telescope-station-a-million-miles-from-earth" target="_blank" rel="noopener noreferrer">James Webb Space Telescope takes up station a million miles from Earth</a> <div class="EntryToolbar dark"><button aria-label="Read Later" class="EntryReadLaterButton EntryReadLaterButton--dark button-icon-only" type="button"><span class="button__icon-wrapper"><svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="icon icon-white"><path d="M16 2.929H8a2.5 2.5 0 0 0-2.5 2.5v16l.007.084a.5.5 0 0 0.723.36l5.777-2.998 5.762 2.997a.5.5 0 0 0.731-.443v-16a2.5 2.5 0 0 0-2.5-2.5Zm0 1.144.006A1.5 1.5 0 0 1 17.5 5.43v15.176l-5.261-2.737-.09-.036a.5.5 0 0 0-.371.036L6.5 20.606V5.429a1.5 1.5 0 0 1 1.5-1.5h8Z" fill="currentColor" fill-rule="nonzero"></path></svg></span></button> <div class="fx tag-button"><button aria-label="Save to Board" class="tag-button__button EntryToolbar__tag-button EntryToolbar__tag-button--dark tag-button__button--dark button-icon-only" type="button"><span class="button__icon-wrapper"><svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="icon icon-white"><g fill="currentColor" fill-rule="nonzero"><path d="M11.48 2.78a.5.5 0 0 1.85-.08l.047.08 2.797 5.687 6.256.918a.5.5 0 0 1.333.788l-.056.065-2.47 2.413a.5.5 0 0 1-.757-.646l.059-.069 1.746-1.709-5.516-.808a.5.5 0 0 1-.324-.191l-.052-.083-2.465-5.012-2.464 5.012a.5.5 0 0 1-.282.25l-.094.024-5.517.808 3.993 3.904a.5.5 0 0 1.15.345l-.007.097-.942 5.511 4.93-2.602a.5.5 0 0 1.627.133l.049.076a.5.5 0 0 1-.133.626l-.076.05-5.827 3.075a.5.5 0 0 1-.734-.446l.008-.08 1.068-6.253-4.527-4.425a.5.5 0 0 1.194-.833l.083-.02 6.255-.918 2.798-5.688Z"></path><path d="M17 13.5a.5.5 0 0 1.492.41l.008.09v6a.5.5 0 0 1-.992.09L16.5 20v-6a.5.5 0 0 1.5-.5Z"></path><path d="M20 16.5a.5.5 0 0 1.09.992L20 17.5h-6a.5.5 0 0 1-.09-.992L14 16.5h6Z"></path></g></svg></span></button></div> <button aria-label="Mark as Read" class="EntryMarkAsReadButton EntryMarkAsReadButton--dark button-icon-only" type="button"><span class="button__icon-wrapper"><svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="icon icon-white"><path d="M20.215 5.65a.5.5 0 0 1.77.63l-.057.07-11.786 12a.5.5 0 0 1-.643.06l-.07-.06-5.357-5.454a.5.5 0 0 1.645-.76l.068.06 5 5.09L20.216 5.65Z" fill="currentColor" fill-rule="nonzero"></path></svg></span></button> <button aria-label="Mark as Read and Hide" class="EntryHideButton EntryHideButton--dark button-icon-only" type="button"><span class="button__icon-wrapper"><svg width="24" height="24" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" class="icon icon-white"><g fill="currentColor" fill-rule="nonzero"><path d="M4.79 4.79a.5.5 0 0 1.637-.059l.07.058L19.21 18.504a.5.5 0 0 1-.638.765l-.07-.058L4.79 5.496a.5.5 0 0 1 0-.707Z"></path><path d="M18.504 4.79a.5.5 0 0 1.765.637l-.058.07L5.496 19.21a.5.5 0 0 1-.765-.638l.058-.07L18.504 4.79Z"></path></g></svg></span></button> </div> <div class="metadata EntryMetadata"> <div class="EntryMetadataBasic__source-info"><span class="EntryEngagement EntryEngagement--no-icon" title="metric showing how popular this article is">24</span><a class="link entry__source" href="https://www.theguardian.com/uk">The Guardian</a> / <span class="EntryMetadataAgo ago lessThanAnHour" title="Published: Mon, 24 Jan 2022 22:03:21 GMT Received: Mon, 24 Jan 2022 22:12:11 GMT"> 25min</span></div> </div> <div class="summary"> $10bn observatory manoeuvred into position at four times the orbit of the moon, with first images expected in June The world's largest and most powerful telescope has reached its final destination – an observation post one million miles away from Earth. Nasa's $10bn James Webb Space Telescope launched on Christmas Day last year from French Guiana on a quest to behold the dawn of the universe. Due</div> </div> </article>

and this is the userscript (JS) I have so far.

 var articles = document.getElementsByTagName('article'); for(let i = 0; i < articles.length; i++) { articles[i].addEventListener("click", function(e) { e.preventDefault; let dest = articles[i].attr("data-alternate-link"); window.open(dest, '_blank'); }); }

EDIT: I just noticed that when Feedly creates the on-page summary it does actually change the URL too. Is there any way to prevent this?

Can anyone help me troubleshoot this code?

Answer 1

Instead of input, use article.

var articles = document.getElementsByTagName('article');
  
for (let i = 0; i < articles.length; i++) {
  articles[i].addEventListener("click", function(e) {
    e.preventDefault;
    var dest = articles[i].attr("data-alternate-link");
    window.open(dest, '_blank');
  });
}