$(document).ready(function(){
    // cache do container
    var video_container = $('.playlist-viewport');

    $('.playlist-item').on('click', function(event){
        // pega apenas a hash do link
        var video_id = "#" + this.href.split('#')[1];

        // esconde o vídel atual
        video_container.find('.video.active').removeClass('active');
        
        // mostra o novo video
        $(video_id).addClass('active');

        // evita que o browser siga o link
        event.preventDefault();
        return false;
    });
});

body {
    background-color: #555;
    margin-top: 30px;
}

.playlist-viewport {
    list-style: none;
}

.playlist-viewport > .video {
    display: none;
}

.playlist-viewport > .video.active {
    display: block;
}

<!-- frameworks e bibliotecas -->
<script src="https://code.jquery.com/jquery.min.js"></script><linkhref="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script><!--grid--><divclass="container">
    <div class="row">
        <div class="col-xs-9">

            <!-- Container para os videos -->
            <ul class="playlist-viewport">
                <!-- Video 1 -->
                <li id="video-1" class="video active">
                    <!-- video responsivo (bootstrap) -->
                        <div class="embed-responsive embed-responsive-16by9">
                            <video class="embed-responsive-item" controls="controls" 
                            poster="http://sandbox.thewikies.com/vfe-generator/images/big-buck-bunny_poster.jpg" >
                                <!-- sources para o player HTML5 -->
                                <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4"type="video/mp4" />
                                <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.webm"type="video/webm" />
                                <source src="http://clips.vorwaerts-gmbh.de/big_buck_bunny.ogv"type="video/ogg" />

                                <!-- Fallback para player em Flash -->
                                <object type="application/x-shockwave-flash" 
                                    data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" 
                                    width="640" height="360">
                                    
                                    <param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" />
                                    <param name="allowFullScreen" value="true" />
                                    <param name="wmode" value="transparent" />
                                    <param name="flashVars" 
                                        value="config={'playlist':['http%3A%2F%2Fsandbox.thewikies.com%2Fvfe-generator%2Fimages%2Fbig-buck-bunny_poster.jpg',{'url':'http%3A%2F%2Fclips.vorwaerts-gmbh.de%2Fbig_buck_bunny.mp4','autoPlay':false}]}" />
                                    <img alt="Big Buck Bunny" 
                                        src="http://sandbox.thewikies.com/vfe-generator/images/big-buck-bunny_poster.jpg"width="640" height="360" 
                                        title="No video playback capabilities, please download the video below" />
                                </object>
                            </video>
                    </div>
                </li>

                <li id="video-2" class="video">
                    <div class="embed-responsive embed-responsive-16by9">
                        <video class="embed-responsive-item" controls="controls" >
                            <source src=http://techslides.com/demos/sample-videos/small.mp4 type=video/mp4>
                            <source src=http://techslides.com/demos/sample-videos/small.webm type=video/webm> 
                            <source src=http://techslides.com/demos/sample-videos/small.ogv type=video/ogg> 

                            <object type="application/x-shockwave-flash" 
                                data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" 
                                width="640" height="360">
                                
                                <param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" />
                                <param name="allowFullScreen" value="true" />
                                <param name="wmode" value="transparent" />
                                <param name="flashVars" 
                                value="config={'playlist':[{'url ':'http%3A%2F%2Ftechslides.com%2Fdemos%2Fsample-videos%2Fsmall.mp4','autoPlay':false}]}" />
                            </object>
                        </video>
                    </div>
                </li>
            </ul>

        </div>

        <!-- Container da lista de vídeos -->
        <div class="col-xs-3">
            <ul class="list-group">
                <a href="#video-1" class="list-group-item playlist-item">Big Buck Bunny</a>
                <a href="#video-2" class="list-group-item playlist-item">Outro vídeo</a>
            </ul>
        </div>

    </div>
</div>