JSFiddle - React, Tailwind, and code Playground

HTML

<ul id="s">
<li id="a" title="http://wasteland.su:8080/radio">Wasteland</li>
<li title="http://stream-tx3.radioparadise.com/ogg-96">Radio Paradise</li>
<li title="http://radio.goha.ru:8000/grind.fm">Grind FM</li>
<li title="http://listen.42fm.ru:8000/stealkill">42FM</li>
</ul><audio id="p">

CSS

ul{padding:0;list-style-type:none;width:20em}
li{padding:1em 0 1em 3.5em;background:#fff;border:solid 2px #ddc;font-weight:bold;position:relative}
li:after{content:'';position:absolute;top:.3em;left:.3em;display:inline-block;width:35px;height:40px;background:url(//i.imgur.com/fqtrebq.png) -37px 0 no-repeat}
.a{background:#ffe}
.a:after{background-position:2px 0}

JavaScript

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

// 113 bytes