有关所选元素对象的数组收集信息

Question

我有这样的标记：

<span class="makearray">click me</span> 
<div id="container"> 
    <ul> 
     <li class="noindex"><span class="txt">blahblah</span></li> 
     <li class="noindex"><span class="txt">blahblah</span></li> 
     <li class="index"><span class="txt">text1</span> 
      <ul> 
       <li class="index"><span class="txt">text2</span> 
        <ul> 
         <li class="noindex"><span class="txt">blahblah</span></li> 
         <li class="index"><span class="txt">text3</span></li> 
        </ul> 
       </li> 
      </ul> 
     </li> 
    </ul> 
</div> 

当我点击.makearray元素，我想收集信息关于我的所有.txt元素是第一儿童的.index列表项（也许使用jQuery .index()方法？），使这个数组：

var info = [{ 
    "index": "1", 
    "txtcontent": "text1" 
}, { 
    "index": "2", 
    "txtcontent": "text2" 
}, { 
    "index": "3", 
    "txtcontent": "text3" 
}] 

其中index属性是一个整数i在.container元素中指示.index > .txt:first-child元素的位置，txtcontent是应用于此元素的Jquery text()方法的结果。
注：txt元件可以具有contenteditable属性，我甚至可能插入新li.index元素注入ul动态，所以每次我点击.makearray，现有的阵列必须由新的替换（即，从头开始重建）。

请帮忙，谢谢

Answer 1

可以使用child combinator >为目标的跨度，以及jQuery的.map构建阵列：

var arr = $('.index > .txt').map(function(i,el){ 
    return { 
     index : i, 
     txtcontent : el.textContent 
    }; 
}); 
console.log(arr); 

http://jsfiddle.net/39VyA/1/