malefikus13,
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
<style type="text/css">
.pozitive{
background-color: #FF0000;
}
.negative{
background-color: #008000;
}
.test{
background-color: #D2691E;
}
a{
color: #FFFF00;
}
</style>
</head>
<body>
<div id="block">
<div class="test">
<div><b>Пётр</b></div>
</div>
<div class="negative">
<div><b>Вася</b></div>
</div>
<div class="pozitive">
<div><b>Аня</b></div>
</div>
<div class="pozitive">
<div><b>Вова</b></div>
</div>
<div class="negative">
<div><b>Боря</b></div>
</div>
</div>
<script type='text/javascript'>
var c = document.querySelector("#block");
Array.apply(null,document.querySelectorAll("#block > div"))
.sort(function(a, b) {
a = a.classList;
a = a.contains('pozitive') ? -1 : a.contains('negative') ? 0 : 1;
b = b.classList;
b = b.contains('pozitive') ? -1 : b.contains('negative') ? 0 : 1;
return a < b ? -1 : a > b ? 1 : 0
})
.forEach(function(a) {
c.appendChild(a)
});
</script>
</body>
</html>