jquery conditional problem

[zszucs]

total noob at jquery so not suprised that i ran into a problem.  what im trying to do is an image swap when clicking on a group of images which works fine.  The problem is that i need the image swap only to occur when only one particular item is selected from a drop list.  this is what i have so far (probably could be more effiecient but i'm new at this):

 

<script type="text/javascript">	
<?php

	$sql = "SELECT * FROM images WHERE image_category_id=2";
	$result = mysql_query($sql);		
	if (!$result) {
		die('Invalid query: ' . mysql_error());
	}	
	if(mysql_num_rows($result) > 0) {
?>
     $(document).ready(function(){
<?php
while($row = mysql_fetch_array($result)) {
?>
//if ($("#office_loc")[0].selectedIndex == 1) {
          $('#action_card<?=$row['id']?>').toggle(

//function(){ alert($("#office_loc")[0].selectedIndex) },


               function() { 

                    $('#action_card<?=$row['id']?>').show('slow');

                    $('#main_image').attr('src','images/<?=$row['image']?>');

               }, function() { 

                    $('#main_image').show('slow');

                    $('#main_image').attr('src','images/<?=$row['image']?>');
               });					
//}					

<?php
}               
?>               

     });
<?php
	}
?>
</script>

i tried putting the conditional 

if ($("#office_loc")[0].selectedIndex == 1) {

outside and inside of  $('#action_card<?=$row['id']?>').toggle  to no avail.  I also tried

 

if ( $("#office_loc").val() != 'whatever') ) {

 

which also didn't work. Need some help here ...