JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/css/bootstrap-select.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-select/1.10.0/js/bootstrap-select.min.js"></script>
<div class="row select-parent">
    <div class="col-md-12">
        <div class="form-group">
            <div class="col-sm-7">
                <select class="selectpicker" name="productType" id="productType">
                    <option value=""></option>
                    <option value="Cereal">Cereal</option>
                </select>
            </div>
        </div>
    </div>
</div>
<div class="row hiddenRow select-parent" id="yearRow">
    <div class="col-md-12">
        <div class="form-group">
            <div class="col-sm-7">
                <select class="selectpicker" name="camYear" id="camYear">
                    <option value=""></option>
                    <option value="2016">2016</option>
                </select>
            </div>
        </div>
    </div>
</div>
<div class="row hiddenRow select-parent" id="monthRow">
    <div class="col-md-12">
        <div class="form-group">
            <div class="col-sm-7">
                <select class="selectpicker" name="camMonth" id="camMonth">
                    <option value=""></option>
                    <option value="March">March</option>
                </select>
            </div>
        </div>
    </div>
</div>
<div class="row hiddenRow select-parent" id="idRow">
    <div class="col-md-12">
        <div class="form-group">
            <div class="col-sm-7">
                <select class="selectpicker" name="camId">
                    <option value=""></option>
             ...

CSS

.hiddenRow {
    display: none;
}

JavaScript

$( ".selectpicker" ).change(function() {
		var $this = $(this);
    
    //Display Next Select
    if ($this.val().toString().length) {
    		$this.closest('div.select-parent').next('div.select-parent').removeClass('hiddenRow');
        return;
    }
    
    //Hide Next All Selects
    $this.closest('div.select-parent').nextAll('div.select-parent').addClass('hiddenRow').find('select').val("").selectpicker('refresh');;
});