如何在向ul追加新li元素时为其添加类？

针对你现有代码，有两种直观的方式实现需求，和你当前代码风格匹配，容易理解：

方法1：直接在拼接的HTML字符串中添加class属性 #

这是最直接的方式，只需要在你拼接<li>标签时，直接加上class属性即可，完全贴合你现有的代码写法：

修改后的完整代码：

$(document).ready(function(){
    $('#btn').click(function(){
        var toAdd = $('input[id=ListItem]').val();
        // 这里在<li>标签里加上class="your-custom-class"，替换成你需要的类名
        $('ul').append('<li class="your-custom-class">' + toAdd + '</li>');
        $('#ListItem').val('');
    });
});

方法2：用jQuery创建元素后添加类（更推荐的jQuery写法） #

如果想更符合jQuery的操作习惯，可以先创建li元素，添加类和文本后再追加到ul中，这种方式可读性更强，也方便后续对这个li做更多操作：

修改后的完整代码：

$(document).ready(function(){
    $('#btn').click(function(){
        var toAdd = $('input[id=ListItem]').val();
        // 创建li元素，添加类，设置文本，再追加到ul
        $('<li>')
            .addClass('your-custom-class')
            .text(toAdd)
            .appendTo('ul');
        $('#ListItem').val('');
    });
});

注意：把上面代码中的your-custom-class替换成你实际需要的类名即可。

内容的提问来源于stack exchange，提问作者upsrecruiter