Как добавить класс при клике, а потом удалить при клике за пределами открывшегося блока?
Простейший дропдаун codepen.io/Zoxon/pen/YwpLpK
При любом клике проверяем, был ли он внутри вашего разворачиваемого элемента или нет.
А плавность можно добавить за счет css свойства transition, например.
https://jsfiddle.net/azvt2fvu/