javascript(jQuery)からdomを複数生成したい

Question

初歩的な質問かもしれないですが、よろしくお願い致します。
以下の様な形でhtmlを出力したい場合、どの様に書けば良いのでしょうか？
漠然と$.eachを使えばいいんだろうなとは思うのですが、、、

■やりたいこと
・inputを複数生成したい
・nameは共通の値を持たせたい
・valueは連番で値を持たせたい
・classは共通の値と連番の値を持たせたい

  <div class="wrap">
    <input type="radio" name="hoge_input" value="val_1" class="btn_radio num-1">
    <input type="radio" name="hoge_input" value="val_2" class="btn_radio num-2">
    <input type="radio" name="hoge_input" value="val_3" class="btn_radio num-3">
    <input type="radio" name="hoge_input" value="val_4" class="btn_radio num-4">
    <input type="radio" name="hoge_input" value="val_5" class="btn_radio num-5">
    <input type="radio" name="hoge_input" value="val_6" class="btn_radio num-6">
    <input type="radio" name="hoge_input" value="val_7" class="btn_radio num-7">
    <input type="radio" name="hoge_input" value="val_8" class="btn_radio num-8">
    <input type="radio" name="hoge_input" value="val_9" class="btn_radio num-9">
    <input type="radio" name="hoge_input" value="val_10" class="btn_radio num-10">
  </div>

Answer 1

$.eachを使うということはこういうことでしょうか？
ループ回したほうがわかりやすいような？

var template = $('<input type="radio" name="hoge_input" class="btn_radio" />');
$.each(new Array(10), function(i) {
  var input = template.clone();
  input.addClass('num-' + (i + 1).toString()).val('val_' + (i + 1).toString());
  $('.wrap').append(input);
});

Comments

[redwing]

ありがとうございます！
確かにループで記述した方がわかりやすいので、今後はそうしてみます！

Answer 2

こんな感じです

<script>
$(function(){
  $('<div class="wrap">').appendTo('#target');
  for(var i=0;i<=10;i++){
    $('<input type="radio" name="hoge_input" class="btn_radio">')
    .val("val_"+i.toString())
    .addClass("num-"+i.toString())
    .appendTo('#target .wrap');
  }
});
</script>
<div id="target"></div>

Comments

[redwing]

ありがとうございます！　無事に意図した通りに出力できました！