Using mediaelement to display gallery of audio

It sounds like you need to set it up with unique IDs for each audio player.

Try changing your PHP to this:

<?php if(get_post_meta($value->ID, 'portfolio_audio', true)!=''){ ?>
<div class="audio-player">
<h2><?php echo $value->post_title?></h2>
<audio id="audio-player-<?php echo $value->ID; ?>" src="https://wordpress.stackexchange.com/questions/206209/<?php echo $audio_url; ?>" type="audio/mp3" controls="controls"></audio>
</div><!-- @end .audio-player -->

That should give each audio player a unique ID.

Then, in your javascript you will need to loop through all the audio players on the page and set up mediaelementplayer on each one. Try this:

$( document ).ready(function() {
    /* -- loop through each player on the page and find it's ID -- */
    $('.audio-player').each(function(){ 
        var player_id = $(this).attr('id');
        setupPlayer(player_id); // call this new function to setup the player
    });
});

function setupPlayer(player_id) { 
    $(player_id).mediaelementplayer({
        alwaysShowControls: true,
        features: ['playpause','progress','volume'],
        audioVolume: 'horizontal',
        audioHeight: 70,
        iPadUseNativeControls: true,
        iPhoneUseNativeControls: true,
        AndroidUseNativeControls: true
    });
}

I haven’t tested this, but it seems like it should work.