jQueryのtoggleについての質問です。
オンオフ画像の切り替えがうまくいかず困っています。
3つのtoggleがあって、一番上が常時開いた状態です。
現状二回クリックしないと画像が切り替わらず、何が間違っているのかもわからずお手上げです。

$(function(){
$(".title:not(:first) .content").hide();
$("h3.archives").click(function(){
$(this).next().slideToggle(200);

$(".title").find("h3.archives span").click(function () {
$(this).toggleClass("commonToggle").toggleClass("close");

});

});
});

<div class="title">
<h3 class="archives"><span class="commonToggle">あ</span></h3>

<div class="content">
<div class="box">
内容
</div>
</div>

</div>

お願いします。