title: jQuery multiple select show/hide
body: <p>I have a table with language translation. I'm trying to create a script that will hide multiple language columns. The problem is that it only hide one field at a time. I can't hide multiple language entries.
  <a href="http://jsfiddle.net/6yv4g/44/" rel="nofollow">Demo</a></p>
  
  <pre><code>$(document).ready(function () {
      $( ".hide" )
          .change(function() {
              var str = "";
              $( ".hide option:selected" ).each(function() {
              str += $( this ).val();
          });
          $('[class^=cell]').show();
          $( ".cell" + str ).hide();
      })
      .trigger( "change" );
  });
  
  &lt;select class="hide" multiple=""&gt;
      &lt;option value="0"&gt;ignore_id&lt;/option&gt;
      &lt;option value="1"&gt;English&lt;/option&gt;
      &lt;option value="2"&gt;French Can&lt;/option&gt;
      &lt;option value="3"&gt;Simp. Chinese&lt;/option&gt;
      &lt;option value="4"&gt;Spanish&lt;/option&gt;
      &lt;option value="5"&gt;Japanese&lt;/option&gt;
      &lt;option value="6"&gt;Trad. Chinese&lt;/option&gt;
      &lt;option value="7"&gt;Russian&lt;/option&gt;
      &lt;option value="8"&gt;Malay&lt;/option&gt;
      &lt;option value="9"&gt;Swedish&lt;/option&gt;
      &lt;option value="10"&gt;Finnish&lt;/option&gt;
      &lt;option value="11"&gt;Italian&lt;/option&gt;
      &lt;option value="12"&gt;German&lt;/option&gt;
      &lt;option value="13"&gt;Danish&lt;/option&gt;
  &lt;/select&gt;
  &lt;table width="100%" cellspacing="0" cellpadding="2" border="0" id="table"&gt;
      &lt;thead&gt;
          &lt;tr class="headings"&gt;
              &lt;th align="left" class="cell0" style="display: table-cell;"&gt;&lt;b&gt;ignore_id&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell1" style="display: table-cell;"&gt;&lt;b&gt;English&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell2" style="display: none;"&gt;&lt;b&gt;French Can&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell3" style="display: table-cell;"&gt;&lt;b&gt;Simp. Chinese&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell4"&gt;&lt;b&gt;Spanish&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell5"&gt;&lt;b&gt;Japanese&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell6"&gt;&lt;b&gt;Trad. Chinese&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell7"&gt;&lt;b&gt;Russian&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell8"&gt;&lt;b&gt;Malay&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell9"&gt;&lt;b&gt;Swedish&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell10"&gt;&lt;b&gt;Finnish&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell11"&gt;&lt;b&gt;Italian&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell12" style="display: table-cell;"&gt;&lt;b&gt;German&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left" class="cell13"&gt;&lt;b&gt;Danish&lt;/b&gt;
  
              &lt;/th&gt;
              &lt;th align="left"&gt;Action&lt;/th&gt;
          &lt;/tr&gt;
      &lt;/thead&gt;
      &lt;tbody&gt;
          &lt;tr&gt;
              &lt;td align="left" class="cell0" style="display: table-cell;"&gt;79891&lt;/td&gt;
              &lt;td align="left" class="cell1" style="display: table-cell;"&gt;test&lt;/td&gt;
              &lt;td align="left" class="cell2" style="display: none;"&gt;Hello World&lt;/td&gt;
              &lt;td align="left" class="cell3" style="display: table-cell;"&gt;你好世界&lt;/td&gt;
              &lt;td align="left" class="cell4"&gt;hello&lt;/td&gt;
              &lt;td align="left" class="cell5"&gt;ハローワールド&lt;/td&gt;
              &lt;td align="left" class="cell6"&gt;你好世界&lt;/td&gt;
              &lt;td align="left" class="cell7"&gt;привет мир&lt;/td&gt;
              &lt;td align="left" class="cell8"&gt;malajec&lt;/td&gt;
              &lt;td align="left" class="cell9"&gt;swed&lt;/td&gt;
              &lt;td align="left" class="cell10"&gt;fin&lt;/td&gt;
              &lt;td align="left" class="cell11"&gt;talo&lt;/td&gt;
              &lt;td align="left" class="cell12" style="display: table-cell;"&gt;gero&lt;/td&gt;
              &lt;td align="left" class="cell13"&gt;Život&lt;/td&gt;
              &lt;td&gt;&lt;span class="edit_b"&gt;&lt;/span&gt;&lt;span class="remove_b"&gt;&lt;/span&gt;
  
              &lt;/td&gt;
          &lt;/tr&gt;
          &lt;tr&gt;
              &lt;td align="left" class="cell0" style="display: table-cell;"&gt;79927&lt;/td&gt;
              &lt;td align="left" class="cell1" style="display: table-cell;"&gt;test&lt;/td&gt;
              &lt;td align="left" class="cell2" style="display: none;"&gt;&lt;/td&gt;
              &lt;td align="left" class="cell3" style="display: table-cell;"&gt;sgs&lt;/td&gt;
              &lt;td align="left" class="cell4"&gt;&lt;/td&gt;
              &lt;td align="left" class="cell5"&gt;&lt;/td&gt;
              &lt;td align="left" class="cell6"&gt;&lt;/td&gt;
              &lt;td align="left" class="cell7"&gt;&lt;/td&gt;
              &lt;td align="left" class="cell8"&gt;&lt;/td&gt;
              &lt;td align="left" class="cell9"&gt;&lt;/td&gt;
              &lt;td align="left" class="cell10"&gt;&lt;/td&gt;
              &lt;td align="left" class="cell11"&gt;&lt;/td&gt;
              &lt;td align="left" class="cell12" style="display: table-cell;"&gt;&lt;/td&gt;
              &lt;td align="left" class="cell13"&gt;&lt;/td&gt;
              &lt;td&gt;&lt;span class="edit_b"&gt;&lt;/span&gt;&lt;span class="remove_b"&gt;&lt;/span&gt;
  
              &lt;/td&gt;
          &lt;/tr&gt;
      &lt;/tbody&gt;
  &lt;/table&gt;
  </code></pre>