新規登録入力ファームにて、ボタンを押すとテキストボックス・セレクトボックスを動的に追加したい

###前提・実現したいこと
Bootstrap3を使ったオプション新規登録ファームにて、ボタンを押すとテキストボックス・セレクトボックスを動的に追加・削除を行いたい
フォームが追加される最大数は10まで
###ソースコード

php
1<!--registerLicence.php-->
2<!DOCTYPE html>
3<html lang="ja">
4<head>
5  <meta charset="UTF-8">
6  <meta name="viewport" content="width=device-width, initial-scale=1.0">
7  <meta http-equiv="X-UA-Compatible" content="ie=edge">
8  <title>オプション登録</title>
9  <link rel="stylesheet" href="./bootstrap/css/bootstrap.css">
10  <link rel="stylesheet" href="./bootstrap/css/bootstrap.min.css">
11  <link href="./bootstrap/css/bootstrap-datepicker.css" rel="stylesheet">
12  <link href="./bootstrap/css/bootstrap-datepicker3.css" rel="stylesheet">
13  <link rel="stylesheet" href="./css/style.css">
14
15</head>
16  <div class="row">
17  <div id="formAdd">
18  <!--オプションをセレクトボックスで表示し選択する-->
19  <div class="form-group col-xs-4">
20    <label class="control-label">オプション</label>
21      <div class="dropdown">
22          <select class="form-control" id="optionSelect">
23            <option selected="selected"></option>
24            <option>オプション1</option>
25            <option>オプション2</option>
26            <option>オプション3</option>
27          </select>
28      </div>
29  </div>
30      <!--オプション期間をカレンダーで選択する-->
31      <div class="form-group col col-xs-5">
32        <label>オプション期間</label>
33        <div class="input-group">
34          <div>
35            <input type="text" name="date" id="optionDateLowerLimit" class="form-control">
36          </div>
37          <div class="control-label" id="option">〜</div>
38          <div>
39            <input type="text" name="date" id="optionDateUpperLimit" class="form-control">
40          </div>
41        </div>
42      </div>
43      <!--オプション・オプション期間追加ボタン-->
44      <font color="#00FF00" size="11">
45        <span class="glyphicon glyphicon-plus-sign" id="formAddButton"></span>
46      </font>
47  </div>
48</div>
49
50    <script src="./js/jquery-1.12.4.min.js"></script>
51    <script src="./bootstrap/js/bootstrap.min.js"></script>
52    <script src="./js/registerLicence.js"></script>
53    <script src="./js/modules(optional)/buttons.js"></script>
54</body>
55</html>

js
1$(function(){
2  $('#formAddButton').click({
3    if ($('#formAdd').children().length < 10) {
4      $('#optionSelect').append('<select class="form-control">');
5      $('#optionDateLowerLimit').append('<input type="text">');
6      $('#optionDateUpperLimit').append('<input type="text">');
7    }
8  });
9});

###試したこと
ボタンが押されると、JS側がオプション・オプション期間のセレクトボックス・テキストボックスを追加してくれると思っていたのですが、何も起こらず・・・
他の方が作ってくださっているページを見たのですが、JavaScriptに関してはあまり理解ができていません
削除ボタンはまだ追加していません

浅はかな考えではありますが、みなさまのお力をお貸ししていただきたいです
JavaScript・PHP共にまだまだ勉強中の身ゆえに至らない所がたくさんあり、さらに
とても見にくいコーディングだと思います
厳しい言葉も真摯に受け止め邁進していく所存です
若輩者ではありますが、よろしくお願いいたします

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

回答2件

JavaScriptの

js
1$(function(){
2  $('#formAddButton').click({
3    if ($('#formAdd').children().length < 10) {
4      $('#optionSelect').append('<select class="form-control">');
5      $('#optionDateLowerLimit').append('<input type="text">');
6      $('#optionDateUpperLimit').append('<input type="text">');
7    }
8  });
9});

にミスがあります。
直すと以下のようになります。

js
1$(function(){
2  $('#formAddButton').click(function(){    //ここにfunction()
3    if ($('#formAdd').children().length < 10) {
4      $('#optionSelect').append('<select class="form-control">');
5      $('#optionDateLowerLimit').append('<input type="text">');
6      $('#optionDateUpperLimit').append('<input type="text">');
7    }
8  });
9});