Jquery: динамическое добавление <tag>в зависимости от количества <div>

Question

Мой вопрос: как добавить список в зависимости от количества дел.Результат будет использоваться для подкачки / навигации по скользящему баннеру

<div class="panel">
  <section>
    <h2>...</h2>
    <p>...</p>
  </section>      
</div>
<div class="panel">
  <section>
    <h2>...</h2>
    <p>...</p>
  </section>      
</div>
<div class="panel">
  <section>
    <h2>...</h2>
    <p>...</p>
  </section>      
</div>

Результат должен выглядеть примерно так:

<ul id="pagging">
  <li><a href="#">nav1</li>
  <li><a href="#">nav2</li>
  <li><a href="#">nav3</li>
</ul>

Но для нас мы хотим, чтобы это было сделано в jquery.Наш jquery сначала посчитает количество элементов div, а затем динамически добавит LI в зависимости от количества элементов div

Answer 1

var divCount = $("div.panel").length;

for(var i=0;i<divCount;i++){
   $("ul#pagging").append($("<li/>").text("nav"+(i+1)));
}

Кроме того, пейджинг имеет только один г.

http://jsfiddle.net/R8mxg/

Answer 2

http://jsfiddle.net/yhufH/

Добавить / удалить div для проверки

Answer 3

с использованием JQuery.each

$("div.panel").each(function(idx){
      $("#pagging").append($("<li/>").text("nav"+(idx+1)));
})

примечание: внутренний код, основанный на

Кингжива