情報登録フォームなどで、ボタンを押すことで同一ページに同じフォームを追加して表示させたい

lang
1<input type="button" id="add_btn" name="フォームを追加" value="">

たとえば上記のボタンをクリックすることで同一フォームを生成したく
下のようなjqueryを調べながら書いたのですが動きません

lang
1<script type="text/javascript">
2	jQuery(document).ready(function($) {
3  	var tbl_cnt = 1; // グローバル変数
4
5	// 追加ボタンをクリックした時の処理
6	$('#add_btn').click(function() {
7		var original = $('#form' + tbl_cnt);
8		tbl_cnt++;
9	
10		// クローンを作成し、元の後ろに設置。
11		$(original)
12			.clone()
13			.insertAfter(original)
14			.attr('id', 'form' + tbl_cnt) // クローンのid属性を変更。
15			.find('label').each(function(idx, obj) { // label要素のfor属性を変更。
16				$(obj).attr('for', $(obj).attr('for').replace(/_[0-9]+$/, '_' + tbl_cnt));
17			})
18			.end()
19			.find('input').each(function(idx, obj) { // input要素のid,name属性を変更。value値を空白に。
20				$(obj).attr({
21					title: $(obj).attr('title').replace(/_[0-9]+$/, '_' + tbl_cnt),
22					url: $(obj).attr('url').replace(/_[0-9]+$/, '_' + tbl_cnt)
23				}).val('');
24			});
25	});
26});
27</script>

どの辺がよくないのでしょうか

行動規範の内容に同意します

回答2件

こういうことでしょうか？

lang
1<html>
2<head>
3<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
4<script type="text/javascript">
5	$(function(){
6		var index = 1;
7		$('#btn').click(function(){
8			var newform = $('#original').clone();
9			newform.attr('id', 'clone_' + index);
10			$('input[name="title"]', newform).val('aaa');
11			$('input[name="url"]', newform).val('bbb');
12			$('#result').append(newform);
13			index++;
14		});
15	});
16</script>
17</head>
18<body>
19
20<button id="btn">フォームを追加</button>
21
22<div id="result">
23</div>
24
25<div style="display:none;">
26<form id="original">
27<input type="text" name="title"/>
28<input type="text" name="url"/>
29</form>
30</div>
31
32</body>
33</html>