Css 更改内部标题元素-字体颜色

我目前正在创建一个手风琴风格的元素，在将单击的元素中的字体颜色更改为

白色时遇到问题。有人能帮我把字体颜色改成黑白吗


CSS:

.accordion h4 { padding-left: .5em; padding-bottom: .5em; color: white; }
                .accordion, .accordion * {
                margin:0;
                padding:0;
            }
        .accordion {
            background-color: #456db5;
            border-radius: 10px;
            padding: 10px 0;
        }
        .accordion dt {
            padding: 0.5em;
            background-color: white;
            cursor:pointer;
            border-bottom: 1px solid #8fcde5;
            font-size: 16px;
            color: black;
        }
        .accordion dt:hover {
            color: black;
        }
        .accordion .on {
            background-color: #456db5;
            cursor:default;
        }

        .accordion dt .on { color: white; }

        .accordion dt, .accordion .on:hover {
            color:black;
        }
        .accordion dd {
            padding-left: 1em;
            margin: 0 auto;
            padding-right: 0.5em;
            background-color: white;
            font-size: 16px;
        }
        /* NOTE:
         Do not apply top/bottom padding or margin to the accordion content,
         as its affects to the box model will cause the animation to be choppy.
         Instead, apply vertical spacing to the content elements.
         */
        .accordion dd p {
            padding-top:.5em;
            padding-bottom:.5em;
        }
        .accordion dt:last-of-type{
            border-bottom:none;
        }

用这个

.accordion .on {
      color: #fff !important;
    }

将您的.on样式编辑为
颜色：白色！重要的而不是
颜色：白色