Javascript 如何为每次单击向div追加新文本？

我有一个多选复选框选项。这类似于“不同状态”下拉列表。用户可以检查多个状态。我的要求是当用户选中所选州名称需要显示的任何复选框时。如果他选择阿拉斯加，需要展示阿拉斯加和 如果他选择了另一个阿拉巴马州，他需要同时展示这两个州

但是我现在的代码显示了一些奇怪的东西

Mycode

<p id="selectedid" class="selected_class"></p>

options.each(function() {
    $("#selectedid").insertAfter($(this).text() + ', ');
});

options.each(function() {
    $("#selectedid").append($(this).text() + ', ');
});

但是当我使用

$（“#selectedid”）.html（$（this.text（）+'，'）始终显示一个选定选项，旧选项替换为新选项。对我来说，当用户第一次查看阿拉斯加时，它会在
p
标签中显示阿拉斯加。第二次，如果用户检查它显示的阿拉巴马州

第二个结果

Alaska , Alaska, Arizona

Alabama, Alabama, Arizona, Alabama, Arizona, Arkansas

第三次，如果用户查看阿肯色州，它会显示

第三个结果

Alaska , Alaska, Arizona

Alabama, Alabama, Arizona, Alabama, Arizona, Arkansas

我的实际要求是，用户选择的需要显示的选项以及是否撤消了需要隐藏的检查。假设如果他选择了3个状态，那么只有3个状态需要像这样显示

Alabama
Arizona
Arkansas

我没有犯错误。
选项。每个（函数（）{
options.each(function() {
if(!$("#selectedid").find($(this)).length)
$("#selectedid").append($(this).text() + '<br/>');
});

if（！$（“#selectedid”）.find（$（this））.length）
$（“#selectedid”）.append（$（this.text（）+”
）；
});
这有帮助吗


HTML

阿拉巴马州
亚利桑那州

JavaScript

$("input[name='options']").click(showAll);

function showAll() {
    var options = $("input[name='options']:checked");
    var temp = "";


    options.each(function() {
        temp += $(this).val();
        temp += "<br\>";

    });

    $("#selectedid").html(temp);
}

showAll();

$（“输入[name='options']）。单击（showAll）；
函数showAll（）{
var options=$（“输入[name='options']：选中”）；
var temp=“”；
选项。每个（函数（）{
temp+=$（this.val（）；
温度+=”；
});
$（“#selectedid”）.html（temp）；
}
showAll（）；

这是java脚本吗？如果是这样，

**

不是有效的注释。当我看代码的时候，我的眼睛发痒。。这是我的第一个问题，我是新来的。你们需要建议格式化。@TJ你们的眼睛现在安全了：）我正在使用引导mult select下拉列表。在该下拉列表中，每个选择选项都包含复选框。所以用户可以选择多个复选框。我正试图在此p标签中显示的那些选定值需要显示，而不是