Есть стилизованный 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>?
И почему то не скрывается всплывающий блок при повторном нажатии