重新加载时，Javascript设置属性值更改为默认值

我有一个身体课叫“bg成功”。还有4个不同类别值的按钮。现在，如果我点击任何一个按钮，它都能正常工作，它会分配新的类值。但若我重新加载我的页面，意味着新分配的类将更改为默认类值“bg success”

现在，我想要的是，在我关闭页面之前，新分配的值必须是活动的，对于正常的页面重新加载，该值不会改变。谢谢：）

我的代码

你好，世界
黄色的
蓝色
灰色
绿色
函数myFunction（）{
document.getElementsByTagName（“正文”）[0].setAttribute（“类”、“bg警告”）；
}
函数myFunction1（）{
document.getElementsByTagName（“正文”）[0].setAttribute（“类”、“bg主”）；
}
函数myFunction2（）{
document.getElementsByTagName（“body”）[0].setAttribute（“class”，“bg secondary”）；
}
函数myFunction4（）{
document.getElementsByTagName（“正文”）[0].setAttribute（“类”，“bg成功”）；
}

Codepen链接：这是否回答了您的问题？不，你还有别的解决办法吗。说清楚。。。您尝试使用查询字符串、web存储和Cookie，但这些都不是可接受的解决方案？当然，您也可以使用诸如Redux之类的持久状态容器。您认为不满意的其他解决方案是什么？