JSFiddle - React, Tailwind, and code Playground

HTML

<div id="ru" class="hide">this is russia</div>
<div id="il" class="hide">this is israel</div>
<div id="us" class="hide">this is us</div>
<div id="in" class="hide">this is india</div>


<form id="" action="" method="post">
    <input type="text" value="Carl" name="firstname" id="firstname" />
    <input type="text" value="Johnson" name="lastname" id="lasttname" />
    <br />
    <br />
    <input id="radio_1" type="radio" value="female" name="sex" />Female
    <br />
    <input id="radio_2" type="radio" value="male" name="sex" checked="true" />Male
    <br />
    <br />
    <select id="country-list" name="countries">
        <option value="xx" selected="">Worldwide</option>
        <option value="in">India</option>
        <option value="il">Israel</option>
        <option value="ru">Russia</option>
        <option value="us">United States</option>
    </select>
    <br />
    <br />
    <button id="submit-data" disabled="" type="submit">Save changes</button>
</form>

CSS

[type='submit']:disabled {
    color: #ddd;
}

[type='submit']:disabled:hover {
    background-color: grey;
    color: black;
    cursor: pointer;
    border: none;
    border-radius: 3px;
}

[type='submit']:disabled {
    color: #ccc;
}

.hide { 
    display: none; 
    background: red;;
}

JavaScript

var button = $('#submit-data');
var orig = [];

$.fn.getType = function () {
    return this[0].tagName == "INPUT" ? $(this[0]).attr("type").toLowerCase() : this[0].tagName.toLowerCase();
}

$("form :input").each(function () {
    var type = $(this).getType();
    var tmp = {
        'type': type,
        'value': $(this).val()
    };
    if (type == 'radio') {
        tmp.checked = $(this).is(':checked');
    }
    orig[$(this).attr('id')] = tmp;
});

$('form').bind('change keyup', function () {

    var disable = true;
   
    $("form :input").each(function () {
        var type = $(this).getType();
        var id = $(this).attr('id');

        if (type == 'text' || type == 'select') {
            disable = (orig[id].value == $(this).val());
        } else if (type == 'radio') {
            disable = (orig[id].checked == $(this).is(':checked'));
        }

        if (!disable) {
            return false; // break out of loop
        }
    });
    
    var id = $("#country-list").find(":selected").val();
    $('.hide').hide();
	$('#' + id).show();
    
    button.prop('disabled', disable); 
});