Каким образом здесь зависит порядок селекторов? Переход не работает если поставить класс перехода первым https://jsfiddle.net/7u5z943r/ Какая разница? Ведь браузер запоминает весь поток целиком.
$(document).ready(function(){
$('div').click(function(){
$('.q').toggleClass('q1');
});
});
.q1{
background: red;
}
.q{
width: 200px;
height: 200px;
background: black;
transition: all 1s;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="q"></div>