Я хотел бы разделить текст запятыми - то есть следующие ключевые слова:

keyword1, keyword2, keyword3, keyword4

Как я могу иметь черный элемент стиля для каждого ключевого слова, разделенных запятой. Есть простой способ сделать это? Текст всегда динамический, поэтому я никогда точно не знаю, какими будут эти ключевые слова и сколько их будет. Поэтому каждое ключевое слово должно иметь элементы box вокруг него.

<span class="keyword-option-black">keyword1, keyword2, keyword3, keyword4</span>

.keyword-option-black {
    color:white;
    background-size:contain;
    margin:10px;
    padding:5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background:black;
}