刚好在.append（）之后的jQuery .addClass（）表现不符合预期

Question

HTML

<ul class="container" >
   <li class="default-state"> 
      some stuff 
   </li>
</ul>

SASS

.default-state
  transition: all 0.2s ease 0s
  width: 20px

.new-state
  width: 100px

JS

$itemClone = $('li.default-state').clone();
$('ul').append($itemClone);
$itemClone.addClass('new-state');

正在发生的情况是div出现在列表中，其类已经为'.new-state'，并且未应用任何过渡。

我发现这样做很荒谬：

$itemClone = $('li.default-state').clone();
$('ul.container').append($itemClone);
setTimeout(function(){
   $itemClone.addClass('new-state');
}, 1);

它完美地工作。但是我觉得在这种情况下，不必使用.delay（）或setTimeout。 我知道。append()没有回调函数，是否可以在其中添加另一个jquery方法以避免添加愚蠢的1ms延迟？

我想将所有转场/动画都保留在SASS中，因为宽度在媒体查询中是动态的。