делаю перемещение контента под ссылку, на которую кликнет пользователь. Все вроде работает, но когда открываю контент первый раз - все нормально, второй раз через другую ссылку - контент открывается и быстро закрывается. И потом чередуется, то нормально открывается, то плохо. Что я делаю не так? Помогите пожалуйста.
$(function() {
/* Start DocumentReady */
/* StartClickFunction */
$('div.hideWrap a.hideBtn').on('click', function() {
$(this).parent().append($('div.hideWrap>div.hideCont'));
$(this).toggleClass('show').siblings('div.hideCont').slideToggle('normal');
var hideBtn = $('div.hideWrap a.hideBtn').index($(this)),
isShow = $(this).attr('class');
//setCookie('hideBtn' + hideBtn, isShow, 365);
return false;
});
/* End DocumentReady */
});
.hideWrap {
text-align: left;
clear: both;
}
.hideBtn {
display: block;
background: transparent url('http://likbezz.ru/_example/_img/_lib1/_plus.gif') no-repeat left center;
font: bold 11px/15px Verdana, sans-serif;
cursor: pointer;
outline: none;
padding: 1px 14px 2px;
}
.hideBtn.show {
background-image: url('http://likbezz.ru/_example/_img/_lib1/_minus.gif');
}
.hideCont {
display: none;
}
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js?ver=1.7.2"></script>
<script type="text/javascript" src="http://likbezz.ru/_fr/3/1844975.js"></script>
<div id="exContent" style="text-align:left;padding-top:50px;">
<div class="hideWrap">
<a class="hideBtn" href="javascript://" title="Показать\Скрыть блок">Показать</a>
<div class="hideCont">Здесь располагается содержимое class "hideCont"</div>
</div>
<br />
<br />
<div class="hideWrap">
<a class="hideBtn" href="javascript://" title="Показать\Скрыть блок">Показать</a>
</div>
<br />
<br />
<div class="hideWrap">
<a class="hideBtn" href="javascript://" title="Показать\Скрыть блок">Показать</a>
</div>
</div>