Easy way to customize the bullets for my list element in AnguIarJS

I am working on an angularJS webpage. I have a data type for a list.
in HTML, it looks like this:

<div class="basic-page__section-list--mylist" ng-if="section.theList">
<ul class="section-list section-list--mylist">
<li ng-repeat="listItem in section.theList">{{ listItem }}</li>

in JS:

app.controller("myCtrl", function($scope) {
theList: [


This does what it’s supposed to. It prints out a list where Alaska, Arkansas, Florida, Texas are the elements.

However, I want to customize what the bullet looks like it. Instead of the default (which is a point) I would like to use a checkmark. I would also like to know how to further customize the bullets in the future, if I decide to change the symbol, their color, etc.

I know it’s probably a CSS thing, but I am not very familiar with it.

Do I need to make a class called:


and what should I write in it ?

Thank you!

Source: AngularJS