title: jquery functions are not working in safari but working properly in other browsers
body: <p>I am working on the following code. I want to show only option elements depending on the first selected value. As this code is working properly in chrome but not in safari.
  the <code>hide()</code> and <code>show()</code> functions are not working. How i can improve this code so that it will work in safari also?
  my html code is as follows:</p>
  
  <pre><code>&lt;body&gt;
  &lt;select id="shopcategory"&gt;
      &lt;option&gt;&lt;/option&gt;
      &lt;option value="american" selected="selected"&gt;american&lt;/option&gt;
      &lt;option value="indian"&gt;indian&lt;/option&gt;
      &lt;option value="chinese"&gt;chinese&lt;/option&gt;
  &lt;/select&gt;
  &lt;select id="shop-ar"&gt;
      &lt;option class="american"&gt;1&lt;/option&gt;
      &lt;option class="american"&gt;2&lt;/option&gt;
      &lt;option class="american"&gt;3&lt;/option&gt;
      &lt;option class="indian"&gt;4&lt;/option&gt;
      &lt;option class="indian"&gt;5&lt;/option&gt;
      &lt;option class="indian"&gt;6&lt;/option&gt;
      &lt;option class="chinese"&gt;7&lt;/option&gt;
      &lt;option class="chinese"&gt;8&lt;/option&gt;
      &lt;option class="chinese"&gt;9&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p></p>
  
  <p>my jquery code as follows:</p>
  
  <pre><code>$(document).ready(function(){          
      $("#shopcategory").change(function(){
          select= $("#shopcategory option:selected").attr("value");
          $("#shop-ar").children().each(function(){
              if($(this).attr("class")== select){
          //  only selected category options must be displayed  
                  $(this).show();
              }
              else{
                  $(this).hide();
              }
          })
      })
  })
  </code></pre>