Adding CSS class on pseudo-element

There’s no way to give an HTML attribute of any kind to a psuedo element.

Just use the selector twice:

.error:after {
  content: "Error Message";
}
.error:after, .error-style {
  color:red;
}

Also, is there a difference between using “::after” vs “:after”?

According to this:

https://developer.mozilla.org/en/CSS/:after

The ::after notation was introduced in CSS 3 in order to establish a
discrimination between pseudo-classes and pseudo-elements. Browsers
also accept the notation :after introduced in CSS 2.

Note: Microsoft Internet Explorer 8 supports the :after notation
only.

I would argue that error messages might be content, not decoration – but that’s your call.