Изменить статический (li) st элемент на значки

Question

Рассказ: я хочу изменить элементы списка на уникальный значок для каждого элемента списка.

Длинная история: Я использую тему каталога (Listable) в wp, пользователи могут выбрать 0-3 опции из настраиваемого контрольного списка, с таксономией «job_listing_type» (Im, использующий плагин редактора полей wp manager). Плагин выводит выбор в форме li (обычный HTML). Я бы хотел иметь значки вместо текста.

Например: это может быть выход из контрольного списка:

<div id="jmfe-wrap-job_serveras" class="jmfe-custom-field-wrap"> 
    <li id="jmfe-custom-job_serveras" class="jmfe-custom-field ">Alkohol</li> 
    <li id="jmfe-custom-job_serveras" class="jmfe-custom-field ">Endast vegetariskt</li> 
    <li id="jmfe-custom-job_serveras" class="jmfe-custom-field ">Griskött</li> 
</div> 

Как вы видите, литий идентификатор является статическим, поэтому я не могу сделать текст изменения значка, указывая их. Можно изменить «ли» на все, что мне нравится.

Это, как я хочу, чтобы отобразить элементы списка:

Любые предложения о том, как это сделать? Не имеет значения, если css или javascript, независимо от того, что работает в Wordpress.

Answer 1

Вы можете использовать fontawesome или bootstrap's glyphicon.
все, что вам нужно сделать, это в том числе документы css и js библиотеки.