jQueryでulにliを足したいし、XSSは避けたい

このulにjQueryでliを足したい。

<ul class="kore"></ul>

てきとうに調べて書いてみた。

var data_zokusei = 'データ属性';
var li_nakami = '中身';
$(".kore").append('<li class="kurasu" data-zokusei="'+data_zokusei+'">'+li_nakami+'</li>');

あれ？これじゃ、中身のとことかデータ属性のところとかエスケープされなくね？

<marquee>とか入れたらまわりだすやつじゃね？XSSじゃね？

でもJavaScriptでエスケープするやつってreplaceで無理矢理やるやつしかないでしょ？

かっこ悪いじゃん。できればやりたくないじゃん。

色々調べた結果、こうなった。

var data_zokusei = 'データ属性';
var li_nakami = '中身';
$(".kore").append($('<li>').addClass('kurasu').attr('data-zokusei', data_zokusei).text(li_nakami));

いい感じに表示された。