Как реализовать переключение аудио?

Question

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

<div class="item grid" style="background-image: url('{{img}}')">
		<div class="item_music">
			<div class="music_bar">
				<ul>
					<li><a href="{{itunes}}">ITunes</a></li>
					<li id="{{id}}" class="play">
						<i id="play_music" onclick="document.getElementById('audio{{id}}').play()" class="fa fa-play"></i>
						<i id="pause_music" onclick="document.getElementById('audio{{id}}').pause()" class="fa fa-pause"></i>
						<audio id="audio{{id}}" class="audio_cont" src={{src}} onended="$('audio').css('bottom', '-40px'); $('#{{id}}').find('#pause_music').fadeOut(); $('#{{id}}').find('#play_music').fadeIn();" controls></audio>
				</li>
				<li><a href="{{text}}">Text</a></li>
			</ul>
		</div>
	<p class="text_dec">{{name}}</p>
	</div>
</div>

$('.play').each(function() {
    var $play = "#" + String($(this).attr("id"));
    $($play).find('#pause_music').hide();
    $($play).on('click', '#play_music', function() { // Включение
        $(this).fadeOut(200, function() {
            $($play).find('audio').css("bottom", 0);
            $($play).find('#pause_music').fadeIn(200)
        });
    });
    $($play).on('click', '#pause_music', function() { // Остановка
        $(this).fadeOut(200, function() {
            $($play).find('audio').css("bottom", "-40px");
            $($play).find('#play_music').fadeIn(200);
        });
    });
});

Как сделать, чтобы при включении следующей аудиозаписи текущая останавливалась