Jquery 使用函数从外部文件添加div？

我正在为工作intranet站点创建一个faq页面，希望有一个包含问题的文件和一个包含相关答案的文件，这样我就可以只编辑两个页面，而不必编辑多个不同的页面。我已经让它工作了，因此当点击问题时，答案会显示在faq.php页面上的问题下方：

<ul>
<li><a id="abc" href="#"> question here</a></li>
<div id="abc1"></div>
</ul>

---

它工作得很好。。。有没有一种方法可以将其放入函数中，这样我就不必为每个新的问题div id编写一个新的jQuery块？

不要使用id。id应该是唯一的。因此，如果您使用id选择器连接您的功能，它将是特定的。我们需要一些通用的解决方案

使用css类选择器，以便可以将其应用于许多项。因此，我将像这样对标记进行一个小的调整

 <ul>
    <li>
        <a id="abc" href="#" class="q"> question here</a>
        <div id="abc1" class="a"></div>
    </li>
    <li>
        <a id="abc2" href="#" class="q"> question 2 here</a>
        <div id="abc2" class="a"></div>
    </li>
 </ul>

如果要将单击的问题的Id传递到test.php页面以获取该特定问题的答案，可以发送（标记的）Id

这是一个JSFIDLE演示（在应答中使用静态文本，而不是调用ajax方法）

---

谢谢你的回答，但我不确定我是否做错了什么，因为当我使用第二个示例中的代码并单击问题时，两个答案都显示在两个问题下？@Jake:出现语法错误。我修复了它并添加了一个JSFIDLE。我不确定您想要哪种html，所以这里有一些问题和external test.php页面中的html

 <ul>
    <li>
        <a id="abc" href="#" class="q"> question here</a>
        <div id="abc1" class="a"></div>
    </li>
    <li>
        <a id="abc2" href="#" class="q"> question 2 here</a>
        <div id="abc2" class="a"></div>
    </li>
 </ul>

$(function() {
    $('.q').click(function() {
      var item=$(this);
      item.parent().find(".a").load('test.php #xyz');
});

$(function() {
    $('.q').click(function() {
      var item=$(this);
      var clickedQuestionId=item.attr("id");
      item.parent().find(".a").load("test.php?qid="+clickedQuestionId+"#xyz");
    });
});