JSFiddle - React, Tailwind, and code Playground

HTML

<form name="1" onsubmit="form_submit(event)">
  <input type="text" name="text" value="Grizzly Bear">
  <input type="submit">
</form>

<form name="2" onsubmit="form_submit(event)">
  <input type="text" name="text" value="Mule Deer">
  <input type="submit">
</form>

<form name="3" onsubmit="form_submit(event)">
  <input type="text" name="text" value="Timber Wolf">
  <input type="submit">
</form>

<button onclick="submit_all()">
  Submit All
</button>

CSS

form {
  margin: 10px 0;
  padding: 5px;
}

JavaScript

function submit_all() {
	// For every form, do your ajax function
	for(let i=0; i < document.forms.length; i++) {
  	do_ajax(document.forms[i])
  }
}

function do_ajax(form) {
	// Do your ajax call here.
  // For this example we'll change the text and color instead
  form.style.backgroundColor = 'yellow'
  form.innerHTML = 'form-'+form['name']+' submitted: ' + form['text'].value
}

function form_submit(e) {
	// Individual submits
  e.preventDefault()
  do_ajax(e.target)
}