Adding all list items to single class - html

Question

Instead of adding a individual class to each list items, is there a way to add a single class to a whole set of list item at once?
CSS
<li class="foot_nav">Home</li>
<li class="foot_nav">Discovery</li>
<li class="foot_nav">Subjects</li>
<li class="foot_nav">Guide</li>
<li class="foot_nav">About us</li>
Thanks

Answer 1

It's only one way - JS. Jquery for example:
$('li').addClass('foot_nav');

Answer 2

Just add a class to parent and use child selector:
.foot_nav li {
display: inline-block;
}
<ul class="foot_nav">
<li>Home</li>
<li>Discovery</li>
<li>Subjects</li>
<li>Guide</li>
<li>About us</li>
</ul>

Answer 3

apply the class to the entire ul and then targeth the ul li using CSS
.foot_nav{list-style:none}
.foot_nav li:nth-child(even) {background:red}
.foot_nav li:nth-child(odd) {background:yellow}
<ul class="foot_nav">
<li>Home</li>
<li>Discovery</li>
<li>Subjects</li>
<li>Guide</li>
<li>About us</li>
</ul>
<ul class="foot_nav">
<li>Home</li>
<li>Discovery</li>
<li>Subjects</li>
<li>Guide</li>
<li>About us</li>
</ul>
//css
.foot_nav li{//styling}

Answer 4

What do you need it for?
Maybe you should add the class to its parent.
<ul class="foot_nav">
<li></li>
…
</ul>

Answer 5

.foot_nav
{
list-style-type:none;
}
.foot_nav li
{
display:inline-block;
}
<ul class="foot_nav">
<li >Home</li>
<li >Discovery</li>
<li >Subjects</li>
<li >Guide</li>
<li >About us</li>
</ul>

Answer 6

Something like this in JavaScript should do the trick:
var lis = document.querySelectorAll("li");
for(var i = 0; i < lis.length; i++){
lis[i].className = lis[i].className += " foot_nav"
}

Answer 7

Try this
.list-item li{
}
.list-item:nth-child(1){
}
.list-item:nth-child(2){
}
<ul class="list-item">
<li></li>
<li></li>
<li></li>
<li></li>
</ul>