JSFiddle - React, Tailwind, and code Playground

HTML

<div class="pfi-area">
				<div class="pfi-charge-notification">
					<p class="pfi-charge-text">Subscribe to Cellondo until you text STOP to 83463.  This will be charged to your mobile phone</p>
				</div>

				<div class="pfi-test-mode">
					<p class="pfi-test-text">This site is in test mode.  No charge will be levied against your mobile account</p>
				</div>
				<div class="pfi-input" id="pfi-input">
					<p id="pfi-msisdn-message" class="pfi-label-text"><strong>Please enter your mobile number</strong></p>
					<input type="tel" id="pfi-msisdn" maxlength="14" value="">
				</div>

				<div id="pfi-msisdn-button-mt" class="pfi-button pfi-purchase" data-pfi-link-id="1e52386a-ede4-4d1f-8663-1c465dbad900">
					<span class="pfi-button-text">Subscribe Now for £4.50 per week</span>
				</div>

				<div class="pfi-wait">Please wait...</div>
			</div>

CSS

.pfi-area{
  border:1px solid red;
}

JavaScript

if($){ var jq = $.noConflict(); }
else if(jQuery){ var jq = jQuery.noConflict(); }
else { var jq = null; }

jq("pfi-area").click(function(event){
	alert("test");
});

/* $ = $('.myUniqueElement').clone(); */
/* $('.myUniqueElement').remove(); */
/* $('div.p').append($clone_elem); */