JSFiddle - React, Tailwind, and code Playground

HTML

<div class="dvPortOmmisionRightInner">
        <div style="float: left">
             <select id="ddlAction">
                <option value="-1" selected="selected"> </option>
                <option value="1">Indirect Call</option>
                <option value="2">Cargo Diversion</option>
                <option value="3">Cargo Rollover</option>
                <option value="4">Shift Cargo</option>
            </select>
        </div>
    </div>

    <div class="dvOmmisionPortinner">

       <p>Service</p>
        <span class="ShowSpan1" style="float: left">
              <select id="ddlService" name="ddlService" class="ddlService">
                <option value="1">Service</option>
                  <option value="2">Service1</option>
                  
              </select>
        </span>

        <p>Voy</p>
        <span style="float: left" class="ShowSpan2">
            <select id="ddlVoy" name="ddlVoy" class="ddlVoy">
                <option value="1">Voy</option>
            </select>
        </span>

JavaScript

$('documnent').ready(function(){
    $('#ddlAction').change(function(){
        var action=$("#ddlAction option:selected").val();
        alert(action);
        if(action==1)
        {
            $('#ddlService').prop('disabled','true');
        }
        else if (action==2)
        {
            $('#ddlVoy').prop('disabled','true');
        }
        else
        {
            $('#ddlService').prop('disabled',false);
            $('#ddlVoy').prop('disabled',false);
        }
        alert($("#ddlService option:selected").val());
    });
});