Есть стилизованный select 
<div class="available-tab__select">
  <select data-placeholder="Ширина ботинка">
    <option>Ширина ботинка</option>
    <option value="c">C</option>
    <option value="d">D</option>
    <option value="ee">EE</option>
  </select>
  <div class="available-tab__select-container">
    <a class="available-tab__select-default-param">
      <span>Ширина ботинка</span>
      <div class="available-tab__select-arrow">
        <i></i>
      </div>
    </a>
    <div class="available-tab__select-list">
      <div class="available-tab__select-list-item">Ширина ботинка</div>
      <div class="available-tab__select-list-item">C</div>
      <div class="available-tab__select-list-item">D</div>
      <div class="available-tab__select-list-item">EE</div>
    </div>
  </div>
</div>
https://codepen.io/anon/pen/rvLqWq
Как реализовать переключение, чтобы при выбранном div-е выбирался соответствующий <option> у самого <select>?
И почему то не скрывается всплывающий блок при повторном нажатии