JSFiddle - React, Tailwind, and code Playground

HTML

[System.Web.Services.WebMethod]
    public static ButtonsF GetButtonsF(ButtonsF b)
    {
        return b;
    }

public class ButtonsF
{
    public int startAge { get; set; }
    public int endAge { get; set; }

    public string single  { get; set; }
    public string devorce { get; set; }
    public string widow { get; set; }
    public string goshDan { get; set; }

    public string hasharon { get; set; }

    public string jerusalem { get; set; }

    public string north { get; set; }
    public string south { get; set; }

    public string judaAndSomeron { get; set; }
    public string abroad { get; set; }


}

JavaScript

$("#<%=search2.ClientID %>").click(function () {
            var buttonsF = {};
            if ($('input[id="1"]').css("background-color", "rgb(255, 0, 0)"))
            {
                ButtonsF.single=($('input[id="1"]').attr('value'));
            }
            if ($('input[id="2"]').css("background-color", "rgb(255, 0, 0)")) {
                ButtonsF.devorce=($('input[id="2"]').attr('value'));
            }
            if ($('input[id="3"]').css("background-color", "rgb(255, 0, 0)")) {
                ButtonsF.widow=($('input[id="3"]').attr('value'));
            }
            if ($('input[id="4"]').css("background-color", "rgb(255, 0, 0)")) {
                myArray.goshDan=($('input[id="4"]').attr('value'));
            }
            if ($('input[id="5"]').css("background-color", "rgb(255, 0, 0)")) {
                ButtonsF.hasharon=($('input[id="5"]').attr('value'));
            }
            if ($('input[id="6"]').css("background-color", "rgb(255, 0, 0)")) {
                ButtonsF.jerusalem=($('input[id="6"]').attr('value'));
            }
            if ($('input[id="7"]').css("background-color", "rgb(255, 0, 0)")) {
                ButtonsF.north=($('input[id="7"]').attr('value'));
            }
            if ($('input[id="8"]').css("background-color", "rgb(255, 0, 0)")) {
                ButtonsF.south=($('input[id="8"]').attr('value'));
            }
            if ($('input[id="9"]').css("background-color", "rgb(255, 0, 0)")) {
                ButtonsF.judaAndSomeron=($('input[id="9"]').attr('value'));
            }
            if ($('input[id="10"]').css("background-color", "rgb(255, 0, 0)")) {
                ButtonsF.abroad($('input[id="10"]').attr('value'));
            }                  
          
            ButtonsF.startAge = praseByte($("#<%=minTextBox1.ClientID %>").text);
            ButtonsF.endAge = praseByte($("#<%=maxTextBox2.ClientID %>").text);
            $.ajax({
                type: 'POST',
                url:...