не срабатывает скрипт
 

Добрый день! есть блоки

<div class="price">
    <span>350р</span> 
    <i class="icon green"></i> 
    <div class="textDiscount">
     Quisque at odio pulvinar, aliquet lacus vel, efficitur nibh. Donec non elit augue. Donec lobortis efficitur ornare. Sed viverra tortor lorem, ut aliquam odio pretium id.
    </div>
</div>

<div class="price">
    <span>280р</span> 
    <i class="icon red"></i> 
    <div class="textDiscount">
     Quisque at odio pulvinar, aliquet lacus vel, efficitur nibh. Donec non elit augue. Donec lobortis efficitur ornare. Sed viverra tortor lorem, ut aliquam odio pretium id.
    </div>
</div>

мне нужно что бы при нажатии на .icon открывался .textDiscount . Я прописываю

$(document).on('click','.price .icon',function(e){
  $(this).siblings('.textDiscount').slideToggle(300);
});

и что-то не срабатывает. Подскажите где ошибка?

Нажимать не на что, элемент i пустой. И проще так: $(this).next().slideToggle(300);. А вот делегировать документу не слишком ли далеко? Нужно выбирать ближайшего родителя и то если есть необходимость в делегировании.

PS. jQuery должен быть подключен, а обработчик устанавливаться по событию загрузки документа, если только скрипт не помещен в конце страницы.