JSFiddle - React, Tailwind, and code Playground

HTML

<ul>
<li><a class="ajax-form" data-form="form1.html" data-content="#content">Форма 1</a></li><!--кнопка 1 таба-->
<li><a class="ajax-form" data-form="form2.html" data-content="#content2">Форма 2</a></li><!--кнопка 2 таба-->
<li><a class="ajax-form" data-form="form3.html" data-content="#content3">Форма 3</a></li><!--кнопка 3 таба-->
<li><a class="ajax-form" data-form="form4.html" data-content="#content4">Форма 2</a></li><!--кнопка 4 таба-->
</ul>
  <div id="content"><!--контент таба 1-->
  </div>
  <div id="content2"><!--контент таба 2-->
</div>
  <div id="content3"><!--контент таба 3-->
</div>
 <div id="content4"><!--контент таба 4-->
</div>

JavaScript

$('.ajax-form').on('click',function(e){
    e.preventDefault();
    var form = $(this).data('form');
    var content = $(this).data('content');
    $.ajax({
    	type: "POST",
   		url: form,
    	cache: false,
    	success: function(data) {
    		$(content).html('data');
            
    	},
    	error: function(data) {
    		$(content).html('data-err');
            
    	}
    });
});