JSFiddle - React, Tailwind, and code Playground

by Mi_Creativity

HTML

<div class="set">
    <span data-prefix="[1]">Duck</span>
    <span data-prefix="[2]">Dog</span>
    <span data-prefix="[3]">Cat</span>
    <span>Falcon</span>
    <span data-prefix="[4]">Parrot</span>
</div>

JavaScript

var divSpans = document.querySelectorAll('.set > span');

for(var i=0; i < divSpans.length; i++){
		var prefix = divSpans[i].getAttribute('data-prefix'),
    	divHTML = divSpans[i].textContent;
      
    prefix = (prefix) ? prefix : '[-]';
      
    divSpans[i].innerHTML = prefix + divHTML;
    
}