Toggleclass不工作？

Question

我正在努力制作＆＃39; timelineTile＆＃39; div打开和关闭，如果另一个被打开也关闭，当单击背景时也关闭，我已设法让它关闭，如果另一个点击和背景但我不能得到div关闭如果div单击本身...这是我的fiddle

我的代码;

＆＃13;

＆＃13;

$(function () {
    $('.timelineTile').click(function (evt) {
        evt.stopPropagation();
        $('.selected').children().removeClass('clicked');
        $(this).toggleClass('clicked');
    });


    $(document).click(function () {
        $('.timelineTile').removeClass('clicked');
    });
});

＆＃13;

.timelineTile.clicked{
    background:red;
    width:500px;
    height:300px;
    -webkit-transition:height 1s, left 1s, -webkit-transform 1s;
    transition:height 1s, left 1s, transform 1s;
}

.selected {
    -webkit-transition:height 1s, left 1s, -webkit-transform 1s;
    transition:height 1s, left 1s, transform 1s; 
}


.timelineTile {
   background:black; 
    color:white;
    width:200px;
    height:100px;
    margin-bottom:20px;
    -webkit-transition:height 1s, left 1s, -webkit-transform 1s;
    transition:height 1s, left 1s, transform 1s;
}

.timelineTilehold {
    background:pink;
}
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<ul class="timelineTilehold">
    
    <li class="selected"><div class="timelineTile">hello
    </div></li>

<li class="selected"><div class="timelineTile">hello
    </div></li>

<li class="selected"><div class="timelineTile">hello
    </div></li></ul>

＆＃13;

＆＃13;

＆＃13;

Answer 1

使用.not()，这样就不会删除点击元素上的类

$('.timelineTile').click(function (evt) {
    evt.stopPropagation();
    $('.selected').children().not(this).removeClass('clicked');

DEMO