SOURCE

var channels = ["freecodecamp", "test_channel", "ESL_SC2"];

var getChannelsInfo = function() {
  var getUrl = function(type, channels) {
    var clientId = 'uo6dggojyb8d6soh92zknwmi5ej1q2';
    return 'https://api.twitch.tv/kraken/' + type + '/' + channels + '?client_id=' + clientId + '&callback=?';
  };

  channels.forEach(function(value) {
    var url = getUrl('streams', value);
    $.ajax({
      type: "get",
      url: url,
      dataType: 'jsonp',
      success: function(data) {
        var showBox = '';
        var logo = '';
        var name = '';
        var isOnline = '';
        var status = '';
        if (data.stream === null) {
          showBox = '<div class="show-box show-offline">';
          name = '<a href="https://www.twitch.tv/' + value + '" target="_blank"><span id="name">' + value + '</span></a>';
          isOnline = '<span class="label label-default">offline</span>';
        } else {
          showBox = '<div class="show-box show-online">';
          logo = '<img src="' + data.stream.channel.logo + '" alt="" class="img-circle" id="logo">';
          name = '<a href="https://www.twitch.tv/' + value + '" target="_blank"><span id="name">' + value + '</span></a>';
          isOnline = '<span class="label label-success" id="is-online">online</span>';
          status = '<p id="status">' + data.stream.channel.game + ': ' + data.stream.channel.status + '</p>';
        }
        var showBoxClose = '</div><hr>';

        $(".show").append(showBox + logo + name + isOnline + status + showBoxClose);
      },
    });
  });
};

$("document").ready(function() {
  getChannelsInfo();
});

<div class="container col-sm-8 col-sm-offset-2">

    <!-- header -->
    <div class="header">
      <div class="navbar navbar-default">
        <div class="logo">
          <h2 class="text-center">Twitch Streamers</h2>
        </div>
      </div>
    </div>

    <!-- show -->
    <div class="show"></div>

  </div>

body {
  background: #e5e9ea;
}

.header {
  margin: 40px auto;
}

.header .navbar {
  background: #ffffff;
}

.header .logo {
  margin: 20px;
}

.header .nav {
  margin: 10px;
}

.show {
  background: #ffffff;
  border-radius: 6px;
  padding: 12px 32px;
}

.show-box img {
  width: 64px;
  height: 64px;
  margin: 20px 40px 20px 0;
}

.show-box a {
  color: #34495e;
}

.show-box .label {
  margin-left: 16px;
}