Html 在引导中创建隐藏文本（然后随后显示）？

在我的周期炼金术游戏的“原子”选项卡中，我有下拉列表，允许用户选择他们想要在原子中包含多少质子、中子和电子。如果用户撞击到某个原子，比如氢（1个质子，1个中子，1个电子），那么文本“氢：1”应该出现，表示您已经发现了氢。不幸的是，我在Bootstrap信息网站：getboostrap.com

---

除了情态动词，它不适合我的需要。有解决方案吗？

这不是引导功能。您可以使用CSS隐藏文本：

display:none。您可以使用jQuery
.show（）
来显示它
 这是否符合您的需要


HTML:

我不明白如何使用你在底部给我的脚本。我是否将这些值放在“.val（）”中？你的意思是当用户“找到”一个atom时该怎么办？如果我不知道如何使用它的脚本，这对我没有什么帮助。你能加上吗？
<select class="selection" id="protons">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<select class="selection" id="neutrons">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<select class="selection" id="electrons">
    <option value="0">0</option>
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
</select>
<div class="atom hide" data-protons="1" data-neutrons="1" data-electrons="1">Hydrogen</div>
<div class="atom hide" data-protons="1" data-neutrons="1" data-electrons="2">Whatever</div>

$('.selection').change(function() {
    $('.atom').addClass('hide');
    $('.atom[data-protons=' + $('#protons').val() + '][data-neutrons=' + $('#neutrons').val() + '][data-electrons=' + $('#electrons').val() + ']').removeClass('hide');
});