title: Hide Default Select Drop down Arrow in IE9
body: <p><img src="https://i.stack.imgur.com/7wTGS.png" alt="REF">
   <a href="https://jsfiddle.net/jj3uL5tn/2/" rel="noreferrer">DEMO</a></p>
  
  <p>Ihave tried css <code>appearance: none;</code> to hide select drop down arrow. But In IE9 arrow shows. For reference see the image.</p>
  
  <p>Any idea how to hide arrow using css or jquery?</p>
  
  <p>Here is my code:</p>
  
  <pre><code>    .fields-set select{
  height:32px;
  border:1px solid #ccc;
  margin: 0 19px 0 1%;
  padding:0 32px 0 1%;
  width:55%;
  float: left;
  overflow: hidden;
  background:url("https://encrypted-tbn2.gstatic.com/images?q=tbn:ANd9GcR3xT6PSVebCcTYjggESCb55GBM91fGgbyrMFbs3CGeFoQjFwVB") no-repeat scroll right center padding-box border-box #FFF;
  box-shadow: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
      -ms-appearance: none  \9;
       -o-appearance: none;
      }
  </code></pre>