JSFiddle - React, Tailwind, and code Playground

HTML

<div>
<form>
  <input type="text" id="email_to" name="email_to" required="required" placeholder=" Email*">
</form>
</div>
<div><form>
  <input type="text" id="gelar" name="gelar" placeholder=" Gelar*" required="required">
</form>
</div>
<div><form>
  <input type="text" id="name" name="name" placeholder=" Nama Lengkap*" required="required">
</form></div>
<div><form>
  <input type="text" id="phone" name="phone" placeholder=" Telepon genggam*" required="required">
</form></div>
<div><form>
  <input type="text" id="reference_code" name="referensikode" placeholder=" Kode referensi*" required="required">
</form></div>
<div>
<form>
  <button id="button1">Submit</button>
</form></div>

CSS

.hide{
  display: none;
}

JavaScript

$(document).ready(function(){

	var forms = $('form');
  
  forms.each(function(){
  
  	if(!$(this).find('input[type="submit"]').length &&
       !$(this).find('button').length) {
        $(this).addClass('no-submit-button');
       	$(this).append('<button class="hide"></button>')
       }
  	
  })
  
  $('form').submit(function(e){
  	e.preventDefault();
  })
  
  $('#button1').click(function() {
  	$('.no-submit-button button').trigger('click')
  })

})