jQueryでイベント時に要素を再取得

Question

お世話になっております。

http://farhadi.ir/projects/html5sortable/

上記のjQueryプラグインを使用してドラッグアンドドロップをしようしたリストを作っています。
仮に"sortable2"から"sortable1"にドロップが終了した時に（何らかの要素が追加された時）
"sortable1"のindexを取得するというものを作成したく思いドロップした時にループさせるにはどうすればいいか悩んでおります。
ご教示いただければと思います。お願い致します。

<ul class="sortable1">
    <li class="aaa">Item 1</li>
    <li class="aaa">Item 2</li>
    <li class="aaa">Item 3</li>
    <li class="aaa">Item 4</li>
  </ul>


  <ul class="sortable2">
    <li>Item 5</li>
    <li>Item 6</li>
    <li>Item 7</li>
    <li>Item 8</li>
  </ul>

$('.sortable1, .sortable2').sortable({
    connectWith: '.connected'
});
//プラグイン用

$(function(){

  $("li.aaa").each(function(i) {
    console.log(i + ': ' + $(this).text());
});

Answer 1

リファレンスに書いてあったのですが

$('.sortable1, .sortable2').sortable().bind('sortupdate', function() {
  //ここにソート完了時のスクリプトを書く
  $("li.aaa").each(function(i) {
    console.log(i + ': ' + $(this).text());
  });
});

でいかがでしょうか

Comments

[hebo_san]

回答ありがとうございます。
慣れないjsで四苦八苦でしたのでとてもありがたいです。

index取得はできるようになったのですがsorttable1とsorttable2が接続しなくなってしまうように...

[MasakazuFukami]

なるほど

$('.sortable1, .sortable2').sortable({
connectWith: '.connected'
}).bind('sortupdate', function() {
//ここにソート完了時のスクリプトを書く
$("li.aaa").each(function(i) {
console.log(i + ': ' + $(this).text());
});
});

だといかがでしょうか？

[hebo_san]

迅速な回答ありがとうございます。
接続できました！

当該質問とは別にはなりますが最終的に増えたり減ったりした"sorttable1"のindexを取得→保持→php側を渡すという形にしようと思っているのですが
現状だと"sorttable1"のindexのログが初期の４つのみになってしまうのですがいい指定方法はないものでしょうか？...

[MasakazuFukami]

$(".sorttable1").find('li').each(function(i) {
console.log(i + ': ' + $(this).text());
});

でいかがしょうか！

[hebo_san]

無事解決できました！何度もありがとうございました