JSFiddle - React, Tailwind, and code Playground

by BurpmanJunior

HTML

<p>
    <a href="http://imgur.com/gallery/3HHd2" target="_blank">http://imgur.com/gallery/3HHd2</a>
</p>
<p>
    <a href="http://i.imgur.com/7wryreL.jpg" target="_blank">http://i.imgur.com/7wryreL.jpg</a>
</p>
<p>
    <a href="http://imgur.com/7wryreL,78iEgxf,8HO14Ea" target="_blank">http://imgur.com/7wryreL,78iEgxf,8HO14Ea</a>
</p>

CSS

a{
    font-family: monospace;
    text-decoration: none;
}

JavaScript

/**
 * IMGUR LINK TYPES
 */
var links = document.getElementsByTagName('a');
for(var i = 0; i < links.length; i++){
    // Check for imgur.com or i.imgur.com match
    if(links[i].href.match(/^https?:\/\/(i\.)?imgur\.com/i)){
        links[i].innerHTML = links[i].innerHTML + '<br />[is an Imgur link]';
        // Check for album
        if(links[i].href.match(/(\/a\/|\/gallery\/)/i)){
            links[i].innerHTML = links[i].innerHTML + '<br />[is an album]';
        }else if(links[i].href.match(/imgur.com\/[a-zA-Z0-9]+,/i)){
            links[i].innerHTML = links[i].innerHTML + '<br />[is a group of images]';
        }else if(links[i].href.match(/imgur.com\/[a-zA-Z0-9]+\.[a-zA-Z]+$/i)){
            links[i].innerHTML = links[i].innerHTML + '<br />[is a single image]';
        }
    }
}