How to create a dot / small circle under text?

How can I make a dot under text using only CSS as shown in below picture?

The picture needs to be always in middle with any length of string. Probably I need to use :before OR :after? I've tried but result was awful.