JSFiddle - React, Tailwind, and code Playground

HTML

<input type="text" id="text_1" name="text1" value="" />
    <input type="text" id="text_2" name="text2" value=""/>
    <input type="text" id="text_3" name="text3" value="" />

    <div id="div_1">Only ONE input is filled</div>
    <div id="div_2">Only TWO inputs are filled</div>
    <div id="div_3">All THREE inputs are filled</div>

CSS

#div_1, #div_2, #div_3{
    display: none;
}

JavaScript

$(document).ready(function() {
    $("input[id*='text']").blur(function() {
        var counter=0;
        $("input[id*='text']").each(function(ind, val){
            if($(val).val().trim()!==""){
                counter++;
            }
        });

        $("#div_1, #div_2, #div_3").hide();
        
        $("#div_"+counter).show(); 
    });
});