Trouble using change() function with checkboxes

Trouble using change() function with checkboxes

I'm having trouble getting this change function to work with checkboxes. What I'm trying to do is initially show "startTrendy" to all users, and then once they answer the question "personal_styles", "startTrendy" is hidden and "startClassic" is displayed unless they've picked either 'Trendy' or 'Modern'.

A standard show/hide function isn't working here because they can select up to 3 values (there are 10 choices), and if any of their choices are 'Trendy' or 'Modern' then "startTrendy" needs to be displayed.

  1. $(document).ready(function(){
  2.     $(".img_change").change(function(){
  3.       if( $('input[name=personal_styles[]][value=trendy]').is(':checked') ) {
  4.              $("#startTrendy").show();
  5.              $("#startClassic").hide(); 
  6.         } else {
  7.              $("#startClassic").show();
  8.               $("#startTrendy").hide(); 
  9.         }
  10.     });
  11. });
  1. <form method="post" action="#"> 
  2.  <div id="startTrendy" >Trendy Pics</div>
  3. <div id="startClassic" style="display:none">Classic Pics</div>

  4. <input type=checkbox name="personal_styles[]" value="trendy" class="img_change">Trendy
  5. <input type=checkbox name="personal_styles[]" value="modern" class="img_change">Modern
  6. <input type=checkbox name="personal_styles[]" value="feminine" class="img_change" >Feminine
  7. <input type=checkbox name="personal_styles[]" value="antique" class="img_change">Antique
  8. <input type=checkbox name="personal_styles[]" value="classic" class="img_change" >Classic
  9. </form>

This is a simplified version of my code (since I can't get it to work for one value I couldn't be sure of the correct syntax to use for an OR statement, although I know it would be similar to this:
  1. $("[name=personal_styles[]]").val() === "trendy" || $("[name=personal_styles[]]").val() === "modern")