哇，奇怪这里有这么多过分的答案。。。

<div class="firstClass" onclick="this.className='secondClass'">

在我的一个不使用jQuery的旧项目中，我构建了以下函数，用于添加、删除和检查元素是否具有类：

function hasClass(ele, cls) {
    return ele.className.match(new RegExp('(\\s|^)' + cls + '(\\s|$)'));
}

function addClass(ele, cls) {
    if (!hasClass(ele, cls))
        ele.className += " " + cls;
}

function removeClass(ele, cls) {
    if (hasClass(ele, cls)) {
        var reg = new RegExp('(\\s|^)' + cls + '(\\s|$)');
        ele.className = ele.className.replace(reg, ' ');
    }
}

因此，例如，如果我想onclick向按钮添加一些类，我可以使用这个：

<script type="text/javascript">
    function changeClass(btn, cls) {
        if(!hasClass(btn, cls)) {
            addClass(btn, cls);
        }
    }
</script>
...
<button onclick="changeClass(this, "someClass")">My Button</button>

现在可以肯定，使用jQuery会更好。

Try:

element.className='second'

函数更改（box）｛box.className='second'｝.first｛width:70px；height:70px，background:#ff0｝.second｛width:150px；height:150px，background:#f00；transition：1s｝<div onclick=“change（this）”class=“first”>单击我</div>

下面是一个简单的jQuery代码：

$(".class1").click(function(argument) {
    $(".parentclass").removeClass("classtoremove");
    setTimeout(function (argument) {
        $(".parentclass").addClass("classtoadd");
    }, 100);
});

在这里

Class1是事件的侦听器。父类是托管要更改的类的类Classtoremove是您的旧类。要添加的类是要添加的新类。100是类被改变的超时延迟。

可以这样使用node.className：

document.getElementById('foo').className = 'bar';

根据PPK，这应该在Internet Explorer 5.5及更高版本中工作。

function classed(el, class_name, add_class) {
  const re = new RegExp("(?:^|\\s)" + class_name + "(?!\\S)", "g");
  if (add_class && !el.className.match(re)) el.className += " " + class_name
  else if (!add_class) el.className = el.className.replace(re, '');
}

使用PeterBoughton的答案，这里有一个简单的跨浏览器函数来添加和删除类。

添加类：

classed(document.getElementById("denis"), "active", true)

删除类：

classed(document.getElementById("denis"), "active", false)