SO - 19969751

HTML

<nav class="nav-bar"></nav>  
	<div class="container">
	  <div class="movie">
	  	<div class="cover-movie">
	      <img src="././cover.jpg">
	  	</div>
  		  <div class="title">
  		  	<a></a>
  		  </div>		
	  </div>
	</div>

CSS

*{
  	  	padding: 0;
  	  	margin: 0;
  	  }
  	  body{
  	  	background: #E4E4E4 none repeat scroll 0% 0%;

  	  }
  	  .nav-bar{
  	  	width: 100%;
  	  	height: 40px;
  	  	border-bottom: 1px solid #ccc;
  	  	background: #3498db;
  	  	position: fixed;
  	  	box-shadow: 0px 10px 11px #CCC;
        z-index:999;
  	  }
  	  .container{
  	  	margin:0px auto;
  	  	background: #ecf0f1;
  	  	width: 100%;
  	  	height: 500px;
  	  	border-radius: 5px;
  	  	padding-top: 40px;
  	  }
  	  .movie{
  	  	width:99%;
  	  	height: 270px;
  	  	background:#1B3D42 none repeat scroll 0% 0%;
  	  	margin: 0px auto;
  	  	border-radius: 3px;
  	  	margin-top: 10px;
  	  	box-shadow: 0 0 10px;
  	  }
  	  .cover-movie img{
  	  	width: 100%;
  	  	height: 210px;
  	  	-webkit-filter: blur(0px);
        -moz-filter: blur(0px);
  		-o-filter: blur(0px);
  		-ms-filter: blur(0px);
  		filter: blur(0px);
  	  }
  	  .title{
		background: rgb(33, 74, 80) none repeat scroll 0% 0%;
		width: 100%;
		height: 23px;
		padding-right: 10px;
		box-sizing: border-box;
		line-height: 23px;
  	  	text-align: center;
  	  	color: #ecf0f1;  	  
  	  }
  	  .title a {
  	  	text-align: center;
  	  }

JavaScript

$(document).ready(function(e) {
    	$.getJSON( "http://filmdownload.cf/?and=3", function( data ) {
          $.each(data, function(e,p) {
            $(".title").append('<a>'+p[0]+'-'+p[1]+'</a><br>');
        });
      });
    });