JSFiddle - React, Tailwind, and code Playground

HTML

<form  name="col_1" id="columnA1"  class="col_1"><div>Entrepreneur</div>
    <input name="parent_id" type="hidden" id="parent_id" value="1234" />
    <input name="child_id" type="hidden" id="child_id" value="abcd" />
    </form>

    <form  name="col_1" id="columnA2" class="col_1"><div>Musician</div>
    <input name="parent_id" type="hidden" id="parent_id" value="5678" />
    <input name="child_id" type="hidden" id="child_id" value="efgh" />
    </form>

JavaScript

$.fn.serializeObject = function()
{
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};

$(function(){
  $('.col_1').click(function(){
         $.ajax({
              type:"POST",
              url: "/echo/json",
              data:$(this).serializeObject(),                          
              success: function(){
                 
             }

         }).done(function(data) {
       $('body').append(data);
         });
    });
});