Подскажите пожалуйста, как отсортировать родительские элементы .user
по алфавиту относительно содержимого в дочерних элементах .user__user-name
.
1: Cортировка в редакторе кода, что бы в ручную не менять местами.
2: Сортировка на сайте.
.user-list__user {
background: #325;
color: #fff;
border: 2px solid #287;
margin-bottom: 10px;
padding: 5px;
text-align: center;
}
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Test</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1">
</head>
<main class="main">
<div class="user-list">
<div class="user user-list__user">
<span class="user__user-name">Вася</span>
<span class="user__user-age">45<span>
</div>
<div class="user user-list__user">
<span class="user__user-name">Андрей</span>
<span class="user__user-age">18</span>
</div>
<div class="user user-list__user">
<span class="user__user-name">Сережа</span>
<span class="user__user-age">12</span>
</div>
<div class="user user-list__user">
<span class="user__user-name">Маша</span>
<span class="user__user-age">34</span>
</div>
</div>
</main>
<script src="js/main.min.js"></script>
</body>
</html>