jQuery用于隐藏除第一列之外的其他列选项（动态）。 并点击它显示其他

Question

I am having a problem regarding jQuery. In my (codeigniter)view file i have created a columns which are fetching data from the database perfectly. All i want is to put a jQuery that shows only column_one(id : col_1) firstly, and all the remaining columns would be blank. when i click on any option of the first column it shows second column options.

I am newbie to jQuery and i wonder if i can do this. Sorry, in advance if it is a silly one!

Here is my script i am trying in my view file. Hope you all can get what i am trying.

Script :

$('document').ready(function()) {
var link = "<?php echo base_url(); ?>" ;

//click cat_1, get cat_2
$('#cat_1').click(function() {

    var cat_1 = $(this).val();


// getting data of cat_level_2 from cat_1

$.post(link + 'admin/admin_cat/category/cat_level_2' , {cat_1:cat_1}, function(data)
    {
       $('#cat_3').html('');
       $('#cat_level_4').html('');
       $('#cat_2').html(data);
    });
});       


$('#cat_2').click(function(){
var cat_2 = $(this).val();


// getting data of cat_level_2 from cat_1

$.post(link + 'admin/admin_cat/category/cat_level_3 ' , {cat_2:cat_2}, function(data)
        {
           $('#cat_3').html(data);
           $('#cat_level_4').html('');

        });
});       
}     

Here i have created a columns in view file. which is fetching data from database.

Columns :

<div class="category-col">
                        <select size="15" name='cat_1' id='cat_1'>



                        <?php foreach ($dropdown as  $cat_1) ?>
                        <?php  { ?>

                            <option
                                value=" <?php echo form_dropdown('cat_level', $dropdown);?> ">
                            </option>

                            <?php  } ?>

                        </select>
                    </div>
                    <script type="text/javascript">


                    </script>

                    <div class="category-col">

                        <select size="15" name='cat_2' id='cat_2'>




                        <?php if(isset($cat_level_2) && $cat_level_2 != false){ ;?>

                        <?php foreach ($cat_level_2 as  $cat_2)  {?>

                            <option value="">
                            <?php echo $cat_2; ?>
                            </option>

                            <?php } }?>


                        </select>

                    </div>

                    <div class="category-col">
                        <select size="15" name='cat_3' id='cat_3'>

                        <?php if(isset($cat_level_3) && $cat_level_3 != false){ ;?>

                        <?php foreach ($cat_level_3 as  $cat_3)  {?>

                            <option value="">
                            <?php echo $cat_3; ?>
                            </option>

                            <?php } }?>

                        </select>
                    </div>

Thanks for the consideration mates!