Hi everyone,

I have groups of two select menus. When the page loads, the second select menu is hidden and only appears when the value of the first select menu has a value other than O. The two select menus for each grouping share the same name(key actually).

Group A might be:

<select class="computers" name="computers[amy]">
<select class="employees" name="employees[amy]">

Group B might be:

<select class="computers" name="computers[john]">
<select class="employees" name="employees[john]">

The code below works but it makes all of the second menus appear instead of only for the specific group.

Could someone please help me with this?

Thank you.



Code:
<script>
$(document).ready(function() {
var $e = $('.employees').hide();

$('.computers').change(function() {         
var selection = $(this).val();

if(selection  == '0') {
            $e.hide();
           } 
else {
$e.show();
        }
    });
});
   
</script>