JSFiddle - React, Tailwind, and code Playground

HTML

<script src="http://code.jquery.com/mobile/latest/jquery.mobile.js"></script>
<div id="thelists" data-role="page">
    <div data-role="header">
        <h1>My Title</h1>
    </div><!-- /header -->       
    <div data-role="content">    
        <h3>Add List</h3> 
       <a  data-theme="b" id="mailit" value="mail it">hello</a>
    </div><!-- /content -->
</div><!-- /page -->

JavaScript

$('body').on('click', "#mailit", function (e) {
    e.stopImmediatePropagation();
    e.preventDefault();

    repo = "[email protected]";
    list = "groceries";
    semail = $("#shemail").val();

    urri = 'mailto:'+ repo
           'subject=' + groceries + "would like to join";
           
    var win = window.open(urri);

    /*var iframe = document.createElement('iframe');
    iframe.style.display = 'none';
    document.body.appendChild(iframe);
    iframe.src = urri;*/

    console.log(urri);   
});