JSFiddle - React, Tailwind, and code Playground

by caramba

HTML

<div>
    <ul>
        <li><span class="icon bull"></span>xxx</li>
        <li><span class="icon bull"></span>xxx</li>
        <li><span class="icon bull"></span>xxx</li>
    </ul>
    <ul>
        <li><span class="icon bull"></span>xxx</li>
        <li><span class="icon bull"></span>xxx</li>
        <li><span class="icon bull"></span>xxx</li>
        <li><span class="icon bull"></span>xxx</li>
        <li><span class="icon bull"></span>xxx</li>
    </ul>
</div>

CSS

div {
    white-space: nowrap;
    width: 100%;
}
span {
    display:inline-block;
    margin:0 5px;
}
ul {
	text-align:center;
}
ul li {
    display:inline;
    margin:20px;

}
.hide {
    display:none;
}

.icon {
	position:relative;
	display:inline-block;
	background-position:-1000px -1000px;
	background-image:url(http://www.alexander-bown.com/wp-content/uploads/2011/05/big-black-dot.jpg);
	background-repeat:no-repeat;
	background-size:5px 5px;
	width:5px;
	height:5px;
}
.icon {
	background-position:0px 0px;
	top:-2px;
}

JavaScript

$(document).ready(function() {
        $('ul li:first-child').children('span').addClass("hide");
    });