Replace or change text within CSS

It might be best use javascript for this.

or follow this

html markup:

<div class="cn-categories"><span class="cn_category_label">Categories: </span> <span class="cn-category-name cn_category cn-category-1">Surgery</span></div>

We would like to change the text “Categories:” to “Department”

CSS:

.cn-categories span:first-child {
	display: none !important;
}
.cn-categories::before {
	content: "Department: ";
}