JSFiddle - React, Tailwind, and code Playground

by Vanessa RC

HTML

<div id="mc_embed_signup">
            <form action="//comcarde.us11.list-manage.com/subscribe/post?u=6c8563dd867c6b06de5f40041&amp;id=e3f6d54bb7" method="post" id="mc-embedded-subscribe-form" name="mc-embedded-subscribe-form" class="validate" target="_blank" novalidate>
               <div id="mc_embed_signup_scroll">
                  <h2>Subscribe to our mailing list</h2>
                  <div class="indicates-required"><span class="asterisk">*</span> indicates required</div>
                  <div class="mc-field-group">
                     <label for="mce-EMAIL">Email Address <span class="asterisk">*</span>
                     </label>
                     <input type="email" value="" name="EMAIL" class="required email" id="mce-EMAIL">
                  </div>
                  <div class="mc-field-group">
                     <div class="response" id="mce-error-response" style="display:none"></div>
                     <div class="response" id="mce-success-response" style="display:none"></div>
                     <input type="submit" value="Subscribe" name="subscribe" id="mc-embedded-subscribe" class="button">

                  </div>


            </form>
            </div>

JavaScript

<script type='text/javascript' src='//s3.amazonaws.com/downloads.mailchimp.com/js/mc-validate.js'></script>
      <script type='text/javascript'>
         (function($) {
            window.fnames = new Array();
            window.ftypes = new Array();
            fnames[0] = 'EMAIL';
            ftypes[0] = 'email';
            fnames[1] = 'FNAME';
            ftypes[1] = 'text';
            fnames[2] = 'LNAME';
            ftypes[2] = 'text';
         }(jQuery));
         var $mcj = jQuery.noConflict(true);
      </script>