Javascript append with TMDB api : I have this script

i need to fix append abd remove old info when click, also i need to show episode info on third column how to? 

i need same result to this : https://popcorntime-online.tv/game-of-thrones-season-1-episode-0-15-minute-preview.html?imdb=0944947-1-0

(sorry for my english)
<!-- begin snippet: js hide: false console: true babel: false -->

<!-- language: lang-js -->

    $(document).ready(function() {
      console.log('jQuery');



      var baseUrl = "https://api.themoviedb.org/3/tv/";
      var apikey = "6b4357c41d9c606e4d7ebe2f4a8850ea";
      var appendToResponse = "credits";
      var id = 1399;


      var dataUrl = baseUrl + id + "?api_key=" + apikey + "&append_to_response=" + appendToResponse;

      $.getJSON(dataUrl, function(data) {

        console.log(data);


        var filmtitle = data.name;
        var filmlength = data.episode_run_time;
        var plot = data.overview;


        var release = new Date(data.last_air_date);
        var year = release.getFullYear();
        var seasons = data.seasons.length;






        for (var i = 0; i < data.seasons.length; i++) {
          $(".seasons").append("<div class='row season' data-season='" + data.seasons[i].season_number + "' onclick='seriesInfo(" + id + "," + data.seasons[i].season_number + ")' value='" + data.seasons[i].season_number + "'><a href='#'>Season " + data.seasons[i].season_number + "</a></div>");
          $('.row.season').click(function(e) {
            e.preventDefault();
            $('.season').removeClass('activated');
            $(this).addClass('activated');
          });

        }

      });

    });

    function seriesInfo(id, num) {
      var seriesURL = "https://api.themoviedb.org/3/tv/" + id + "/season/" + num + "?&api_key=6b4357c41d9c606e4d7ebe2f4a8850ea";
      $.getJSON(seriesURL, function(data) {
        console.log(data);
        for (var i = 0; i < data.episodes.length; i++) {
          var seasonname = data.name;
          var seasonoverview = data.overview;
          var episode = data.episodes[i].name;
          var number = data.episodes[i].episode_number;
          var overview = data.episodes[i].overview;
          var airdate = data.episodes[i].air_date;
          $(".episodes").append("<div data-episode_id='" + number + "' data-episode_num='" + number + "' onclick='seriesShow(" + id + "," + data.episodes[i].episode_number + ")' value='" + data.episodes[i].episode_number + "'class='row episode'><a href='#'><span class='episode_num'>" + number + "</span>&nbsp;&nbsp;<span class='episode_title'>" + episode + "</span><div class='pseudo_click_listener'></div></a></div>");



        }
      });
    }

    function seriesShow(id, num) {
      var episodeURL = "https://api.themoviedb.org/3/tv/" + id + "/season/" + num + "/episode/" + num + "?&api_key=6b4357c41d9c606e4d7ebe2f4a8850ea";
      $.getJSON(episodeURL, function(data) {
        console.log(data);
        for (var i = 0; i < data.episodes.length; i++) {

          var seasonoverview = data.overview;
          var episode = data.episodes[i].name;
          var number = data.episodes[i].episode_number;
          var overview = data.episodes[i].overview;
          var airdate = data.episodes[i].air_date;
          $(".show").prepend("<div class='column content'><div class='episode_name'>" + episode + "</div><div class='episode_info'><b class='episode_number'>Episode " + number + "</b></div><div class='episode_overview'>" + overview + "</div>");

        }
      });
    }

<!-- language: lang-css -->

    .synopsis {
      font-size: 13px;
      line-height: 18px;
      color: rgba(255, 255, 255, 0.65);
      padding-right: 20px;
      height: 120px;
      overflow: auto;
    }

    .head {
      color: #fff;
      width: 100%;
      height: 240px;
      position: absolute;
      top: 65px;
      left: 0;
      border-bottom: 1px rgba(255, 255, 255, 0.05) solid;
      z-index: 9;
    }

    .info_cont {
      position: absolute;
      top: 20px;
      left: 185px
    }

    .runtime_cont {
      display: none;
    }

    .poster {
      position: absolute;
      top: 25px;
      left: -200px;
      width: 135px;
      height: 197px;
      box-shadow: 0px 0px 10px rgba(0, 0, 0, 1);
      border: 1px rgba(255, 255, 255, 0.18) solid;
      background-repeat: no-repeat;
      background-position: center center;
      background-size: cover;
      opacity: 0;
      transition-property: all;
      transition-duration: 0.21s;
      transition-timing-function: ease-out;
    }

    .poster.fadein {
      opacity: 1;
      left: 20px;
    }

    .body {
      position: absolute;
      width: 100%;
      height: 100%;
      left: 0;
      bottom: 0;
      z-index: 9;
      box-sizing: border-box;
      background: linear-gradient(to right, rgba(0, 0, 0, 0.27) 0%, rgba(0, 0, 0, 0.75) 100%);
      /* W3C */
    }

    .column {
      float: left;
      height: 100%;
      box-sizing: border-box;
      padding: 20px;
      position: relative;
    }

    .column.seasons {
      width: 15%;
      overflow: hidden;
    }

    .column.episodes {
      width: 40%;
      overflow: hidden;
    }

    .column.content {
      width: 45%;
    }

    .row {
      height: 35px;
      border-bottom: 1px rgba(255, 255, 255, 0.045) solid;
      font-size: 14px;
      color: #fff;
      line-height: 35px;
      padding: 0 6px;
      box-sizing: border-box;
      cursor: pointer;
      position: relative;
      overflow: hidden;
      transition-property: padding;
      transition-duration: 0.1s;
      transition-timing-function: linear;
    }

    .row * {
      cursor: pointer !important;
    }

    .row:hover,
    .row.khover {
      padding: 0 12px;
      border-left: 3px rgba(255, 255, 255, 0.4) solid;
    }

    .row.activated {
      padding: 0 12px !important;
      border-left: 3px rgba(255, 255, 255, 0.8) solid !important;
    }

    .row:nth-child(odd) {
      background: linear-gradient(to right, rgba(255, 255, 255, 0.125) 0%, rgba(255, 255, 255, 0) 100%);
      /* W3C */
    }

    .row.episode .pseudo_click_listener {
      position: absolute;
      width: 16px;
      height: 100%;
      right: 0;
      top: 0;
      z-index: 9;
    }

    .row .episode_title {
      opacity: 0.4;
    }

    .row:hover .episode_title,
    .row.activated .episode_title {
      opacity: 0.68;
    }

    .row .episode_num {
      font-family: opensansbold
    }

    .scroller_cont {
      padding-bottom: 15px;
    }

    .episode_name {
      text-shadow: 2px 2px 2px rgba(0, 0, 0, 1);
      font-size: 22px;
      color: #fff;
      font-family: opensansbold;
    }

    .episode_info {
      font-size: 13px;
      color: rgba(255, 255, 255, 0.4);
      padding: 2px 0 15px;
    }

    .episode_overview {
      height: calc(100% - 135px);
      overflow: auto;
      color: rgba(255, 255, 255, 0.64);
      font-size: 12px;
      line-height: 16px;
    }

    .toolbox_content {
      height: 60px;
      position: absolute;
      bottom: 10px;
      left: 20px;
      z-index: 9;
      width: 100%;
    }

    .selector {
      margin-bottom: 5px;
      width: 160px !important;
    }

    .sep {
      margin-right: 15px !important;
    }

    .row.episode.watched:after {
      content: "\e601";
      color: rgba(255, 255, 255, 0.4);
    }


    .row.episode:after {
      font-family: icomoon;
      content: "\e60d";
      position: absolute;
      right: 0;
      font-size: 11px;
      color: rgba(255, 255, 255, 0.12);
    }

<!-- language: lang-html -->

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
    <div class="body">
      <div class="column seasons"></div>

      <div class='column episodes'></div>
      <div class='show'></div>

<!-- end snippet -->







(sorry for my english)