Динамически генерируемый пронумерованный html на основе количества элементов в div

Question

В основном мне нужно выяснить функцию jQuery, которая будет подсчитывать, сколько дд существует, и добавлять одну соответствующую ссылку с соответствующим порядковым номером хешем к элементу # external-navigation.

Структура HTML должна выглядеть следующим образом:

<dl id="slider">
    <dd>
    </dd><!--slide one-->

    <dd>
    </dd><!--slide two-->

    <dd>
    </dd><!--slide three-->
</dl>

<div id="external-navigation">
    <a href="#1">Slide One</a>
    <a href="#2">Slide Two</a>
    <a href="#3">Slide Three</a>
</div>

Я предполагаю, что это будет использовать что-то вроде $ ('dd'). Each (function (i) {}); ...?

Answer 1

Вы на правильном пути:

$('#slider dd').each(function(i,el) {
    var n = i+1;
    $('#external-navigation').append('<a href="#slide'+n+'">Slide '+n+'</a> ');
});

http://jsfiddle.net/mblase75/NNWsD/1/

http://api.jquery.com/each/

(Вы не должны начинать ID сномер, и вы не должны начинать имя с цифры.)