HTML может ли элемент быть в нескольких классах?

Question

У меня есть класс уль элемент, как это:

<ul class="article-list"> 
    <li class="article-item"> 
     <header>Article #1</header> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Expedita sapiente officiis beatae, ut consequuntur. Quos minus neque eius, nemo sunt excepturi eveniet amet veritatis voluptatibus corporis ea, blanditiis porro ad!</p> 
     <h3>Sample Image Title here</h3> 
     <img src="http://placehold.it/350x150" alt="Placeholder Image"> 
     <ul> 
      <li class="bold">James</li> 
      <li>Lily</li> 
      <li>Harry</li> 
     </ul> 
     <p>Magnam ex autem doloremque, tempore mollitia atque aut delectus corporis rem similique voluptates omnis reiciendis vitae impedit exercitationem unde quaerat, doloribus voluptatibus molestias et veritatis sed optio repudiandae? Provident, voluptates.</p> 
    </li> 
    <li class="article-item featured"> 
     <header>Article #2</header> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Nihil animi ipsum, incidunt mollitia modi cum, eum ex doloremque rerum quod, maiores quisquam, enim quam unde cumque! Quam, doloremque. Voluptatum, maxime!</p> 
     <p>Numquam et quae, quasi. Reiciendis nemo mollitia eveniet alias, debitis facere atque excepturi et beatae laudantium commodi optio unde amet vitae libero quas cupiditate, nam porro minus. Quisquam, odit non.</p> 
    </li> 
</ul> 

В JS, я могу выбрать одну из статьи-элемента с в функции класса и переключения особенность выключается и переключения функции на другой пункт статьи:

var article2, articl3; 
article2 = $('.featured'); 
article3 = article2.next(); 
article2.toggleClass('featured'); 
article3.toggleClass('featured'); 

Мой вопрос: может ли элемент HTML быть присвоен нескольким классам?

Answer 1

Чтобы назначить элемент HTML нескольким классам, все, что вам нужно сделать, это поместить пробелы между именами классов.

<li class="bold important"> 

выше li элемент имеет как bold и important класс, связанный с ним.

EDIT: У вас есть пример этого в вашем вопросе (последний элемент li).

Answer 2

Чтобы добавить несколько элементов к элементу, используйте addClass вместо toggleClass.

var pElement = $("p"); 
pElement.addClass("myClass yourClass"); 
pElement.removeClass("myClass noClass").addClass("yourClass");