jQuery Hide/Show

[fRAiLtY-]

Hi,

 

I have x amount of tables, and a drop-down with x values in. The tables are auto-generated based on the values in the drop-downs, so if there's 4 drop-down selections there's 4 tables. What I want to do is show/hide each table depending on the selection, so if drop-down selection 1 is selected, show table 1 and so on. Here's an example page. There are 4 seperate drop-down entities but I'm only interested in the 3rd one, select paper. This is #attribute129. Once that drop-down is changed to another value I want my tables below to reflect that.

 

Example: http://dev4.printpartnerships.com/flyer-printing

 

Top table is 300gsm Gloss, bottom table is 400gsm Matt. When those options are selected in the drop-down I want the corresponding table only to show. Here's what I have so far but it just hides both of them

 

<script type="text/javascript">
	jQuery.noConflict();
	jQuery(document).ready(function(){
		jQuery('#attribute129').change(function(){
			jQuery('#matrix-container').hide().eq($(this).val()).show()
		});
	});
</script>

 

Hopefully someone can figure it out?

 

Cheers.