JSFiddle - React, Tailwind, and code Playground

by lollero

HTML

<a class="email" href="#" data-first="Earl" data-last="Johnson" data-domain="domain.com">com</a>

<a class="email" href="#" data-first="Tim" data-last="Robinson" data-domain="domain.com"></a>

<a class="email" href="#" data-first="John" data-last="Adams" data-domain="domain.com">hu</a>

JavaScript

$(function() {

    $('.email').each(function() {

        var email = $(this),
            emailD = email.data(),
            construct = emailD.first + '.' + emailD.last + '@' + emailD.domain,
            construct = construct.toLowerCase();
    
        email
            .attr('href', 'mailto:' + construct )
            .html( construct );
    
    });

});