如何在javascript/jQuery中附加现有的html头标记和一些文本并设置其字体大小？

我想将我的标题内容显示为“Rolling App Hello，SanjayB”，其中Rolling App是标题左侧的静态内容，而Hello，SanjayB即附加文本应位于标题右侧，字体大小为10

我正试图这样做，但没有运气

$("#mainheader").html("<h2>Rolling App </h2>"+"<p font-size: 5px;>"+appUserName+"</p>");

$（“#mainheader”）.html（“滚动应用程序”+”“+appUserName+”
”；

试试这个：

$(function(){
    $("#mainheader").append("<h2>Rolling App "
     +"<span style='font-size:10pt;'>"
     +appUserName+"</span></h2>");
});

$（函数（）{
$（“#mainheader”）.append（“滚动应用程序”
+""
+appUserName+“”）；
});

---

@Cerbus:我没有使用CSS，也没有将其设置为fontsize.1 upvote。我很高兴接受这个答案。但是这个“滚动应用程序hello，SanjayB”就像“滚动应用程序”和新行“hello，SanjayB”，我在移动设备上运行这个程序，并使用提供的JSFIDLE链接中的Worklight，它在同一行中。请看我的答案，我在h2标签中包装跨度。是的，我同意，我理解，但同样的，我在手机上移植android应用程序。屏幕大小可能是个问题，因为这么多的文本无法适应手机屏幕。