The quality of images became worse after adding to resource

By default the quality of image is fine, but when I load it to the resource the quality became blurred. Why it’s happening and how to fix it?

example whith original image and how it look’s on page

// S L I D E R - S I N G L E
function setCurrent (first){
$('.current').html(first);
}
// set images to preview and remove big images
$('.description-single').find('img').each(function(){  
  var photoSrc  = $(this).attr('src'),
      photoImg  = '<img src="' + photoSrc + '">';
  $('.all-photos').append('<div class="photo-template">' + photoImg + '</div>');
  $(this).remove();
}); // end each
// set first image preview to current box 
var firstPhoto = $('.all-photos').find('div.photo-template:first').html()
setCurrent(firstPhoto);
// click handler
$('div.photo-template').on('click', function(){
  var selected = $(this).html();
  setCurrent(selected);
});
if($('.all-photos .photo-template img').length < 2) {
  $('.all-photos').hide();
}

live example http://beardhouse.com.ua/detskie-divany/mishutka