Change background on image click

Change background on image click

I have a list of images and I want to change the background of a div when
i click of one of the images. I have something like this but it doesn't
work:
The jQuery: $('.container-inner').find('img').click(function(){ var $url =
$(this).attr('src');
console.log($url);
$('.container-outer').css({'background-image': $url});
});
The HTML:
<div class="container-outer">
<div class="container-inner">
<a href="#"><img
src="http://d1c739w2xm33i4.cloudfront.net/2.2/top_image.jpg"></a>
<a href="#"><img
src="http://a.tgcdn.net/images/products/additional/large/e718_broke_something.jpg"/></a>
<a href="#"><img
src="http://d1c739w2xm33i4.cloudfront.net/2.2/top_image.jpg"></a>
<a href="#"><img
src="http://inspiretrends.com/wp-content/uploads/2013/07/InteractiveSVG.jpg"/></a>
<a href="#"><img
src="http://images5.fanpop.com/image/photos/30800000/-Random-random-30843841-1920-1080.jpg"/></a>
<a href="#"><img
src="http://inspiretrends.com/wp-content/uploads/2013/07/InteractiveSVG.jpg"/></a>
<a href="#"><img
src="http://inspiretrends.com/wp-content/uploads/2013/07/InteractiveSVG.jpg"/></a>
</div>
</div>
Any ideas?