Почему при нажатии между колонок слетают стили css?

Question

[Максим Кононов]

https://kononov1.github.io/media.html

Почему при нажатии между колонок, или столбцов в плеере слетают стили?

<section class="music">
<div class="music_play item gorgorods" style="background-image: url('img/gorgorod.png')">
	<ul class="music_item gorgorod" id="s">
		<li title="media/gorgorod/01.mp3">Не с начала</li>
		<li id="a" title="/media/gorgorod/02.mp3">Кем ты стал?</li>
	</ul>
	<audio id="p" controls></audio>	
</div>

.music .music_play {
    float: left;
    margin-right: 10px; }
    .music .music_play .music_item {
      margin: 5px;
      position: absolute; }
      .music .music_play .music_item li {
        background-color: rgba(0, 0, 0, 0.7);
        color: white;
        padding: 6px 10px;
        cursor: pointer;
        margin-bottom: 5px; }
        .music .music_play .music_item li:hover {
          background-color: #05010F;
          opacity: .9; }
    .music .music_play .gorgorod, .music .music_play .mixxxtape2, .music .music_play .zhid {
      -moz-column-count: 2;
      -webkit-column-count: 2;
      column-count: 2; }
    .music .music_play .mixxxtape1 {
      -moz-column-count: 4;
      -webkit-column-count: 4;
      column-count: 4; }
    .music .music_play audio {
      position: absolute;
      bottom: 0;
width: 100%; }

c='className'
l=t=>t[c]=t[c]=='a'?p.pause():(a[c]=c,a=t,p.src=t.title,p.play(),'a')
s.onclick=e=>l(e.target)

Answer 1

[aloky]

dl4.joxi.net/drive/2017/12/28/0022/1330/1500466/66...

class="music_item gorgorod"
После нажатия
class="a"

c='className'
l=t=>t[c]=t[c]=='a'?p.pause():(a[c]=c,a=t,p.src=t.title,p.play(),'a')
s.onclick=e=>l(e.target)

Надо написать c='id'