如何获取变量的html输出？

Question

我有这样一个脚本（为了更好地理解而改变和简化）：

$(document).ready(function() {

var summary;

function validateSteps(stepnumber){
if(stepnumber == 1){
...
var resultStep1 = '<b>Shape1: </b>' + $('#chooseshape1').val();
summary = resultStep1;}

if(stepnumber == 2){
...
var resultStep2 = '<b>Shape2: </b>' + $('#chooseshape2').val();
summary += resultStep2;}

if(stepnumber == 3){
...
var resultStep3 = '<b>Shape3: </b>' + $('#chooseshape3').val();
summary += resultStep3;}
}

$('#resultSteps').val(summary);

}

#resultSteps

没有输出

只有当我写$('#resultSteps').text(summary);时，我才会在该div中获得输出，但它看起来像是：

<b>Shape1: </b>round, <b>Shape2: </b>square<b>Shape3: </b>rectangle

但我想要这样的输出：

Shape1： round Shape2： sqaure Shape3：矩形

如何实现这一目标？

Answer 1

$("#resultSteps").html(summary);

Answer 2

使用.html按原样输出元素，因此<b>text</b>将变为文字。

 $("#resultSteps").html(summary);

.val无效，因为我认为#resultSteps不是输入字段 .text可能会删除标记（<b>）。

Docs