Fade in background image on load

I want to load one of the random background image by using jquery. Below is the script I am using and it shows random background on refresh but without fadeIn effect. How can I create fadeIn effect onload. Note: I don't want to cycle random images.

$(document).ready(function() {
  var images = ['01.jpg', '02.jpg', '03.jpg', '04.jpg', '05.jpg', '06.jpg', '07.jpg', '08.jpg', '09.jpg', '10.jpg'];

  $('.about').css({'background-image': 'url(../img/bg/' + images[Math.floor(Math.random() * images.length)] + ')'});
  ('.about').fadeIn(1000);
});