jQuery click() 和 append() 在迭代的 div 上没有响应

Question

我正在迭代这个div和脚本，以便用户可以为三个默认选项(问题编辑器-答案容器(添加答案。但是单击"添加答案"不起作用，我看不出为什么。

我为一个工作，但是当我不得不对同一页面上有许多div进行调整时，麻烦就开始了。其他容器(popup.question-editor(有不同的ID，如13,14,15等。这些是通过PHP放置的，这可能无关紧要。

var container = $(".popup.question-editor#12");
container.find(".add-answer").click(function() {
  var order = null;
  order = container.find('.question-editor-answers div:last-child .correct').attr('value');
  order = parseInt(order) + 1;
  container.find('.question-editor-answers').append($('<div class="question-editor-answer-container"><span class="question-answer"><input type=text name="answers[]" /></span><span class="question-correct"><input type="radio" class="correct" value="' + order + '"name="correct"  /></span></div>'));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="popup question-editor" id="12">
  <span class="close" id="close">X</span>
  <form method="post" lpformnum="4">
    <p>
      <label>Question</label>
      <textarea name="question" class="question-input"></textarea>
    </p>
    <p>
      <label>Answers</label>
    </p>
    <div class="question-editor-answers">
      <div class="question-editor-answer-container">
        <span class="question-answer">
						<input type="text" name="answers[]">
					</span>
        <span class="question-correct">
						<input type="radio" class="correct" name="correct" value="0">
					</span>
      </div>
      <div class="question-editor-answer-container">
        <span class="question-answer">
						<input type="text" name="answers[]">
					</span>
        <span class="question-correct">
						<input type="radio" class="correct" name="correct" value="1">
					</span>
      </div>
      <div class="question-editor-answer-container" id="found">
        <span class="question-answer">
						<input type="text" name="answers[]">
					</span>
        <span class="question-correct">
						<input type="radio" class="correct" name="correct" value="2">
					</span>
      </div>
      <div>Something</div>
    </div>
    <div class="add-answer" id="add-answer"><span>add</span></div>
    <p></p>
    <p>
      <input type="checkbox" name="reuse" value="1">Allow reuse (what does this mean?)
    </p>
    <p>
      <input type="hidden" name="add_question" value="add">
      <input type="hidden" name="category" value="1">
      <input type="submit" value="Add">
    </p>
  </form>
</div>

Answer 1

不要使用以数字字符开头的 id：

在 CSS 中，标识符(包括元素名称、类和 ID 选择器(只能包含字符 [a-zA-Z0-9] 和 ISO 10646 字符 U+00A0 及更高，加上连字符 (-( 和下划线 (_);它们不能以数字、两个连字符或后跟的连字符开头 按数字。标识符还可以包含转义字符和任何 ISO 10646 字符作为数字代码(请参阅下一项(。例如 标识符"B&W？"可以写成"B\&W\？"或"B\26 W\3F"。

W3C 推荐