Аякс подгрузка контента

Часто возникает необходимость подгрузить дополнительный контент на уже загруженную страницу. В моем случае это изображение, которое находиться на другой странице с индификатором #photo.

Пример

Пример 2

Кликни

Пример 3

Кликни

HTML

<div id="example-1">Кликни<img src="/wa-data/public/site/img/preloader-294.gif" style="display: none; width: 110px;" > </div>

JS

$(document).ready(function(){              // по окончанию загрузки страницы
    $('#example-1').click(function(){     // вешаем на клик по элементу с id = example-1
        $('#example-1 img').show();      //показываем прилоадер до начала загрузки
        $(this).load('http://smagloiv.ru/dialog-folder/ #photo'); // загрузку HTML кода из файла            
    })
});