Микроформат oomph.js ломает остальную часть моего JS

Я пишу небольшую веб-страницу, которая отображает несколько фотографий Flickr, а также включает микроформаты с использованием oomph.js. У меня есть немного JS, и когда я запускаю код без <script type='text/javascript' src="oomph.js"></script>, код работает нормально (все мои фотографии загружаются. Однако, когда я добавляю приведенный выше тег сценария, мои фотографии не загружаются.

Вот мой сломанный JS (не показывает фотографии):

<script type='text/javascript' src="jquery-1.6.3.min.js"></script>
<script type='text/javascript' src="oomph.js"></script>

<script>
$(document).ready(function() {

var ajaxURL="http://api.flickr.com/services/feeds/groups_pool.gne?id=626753@N20&lang=en-us&format=json&jsoncallback=?"; 
$.getJSON(ajaxURL,function(data) {
    $('h1').text(data.title);
    $.each(data.items,function(i,photo) {
        var photoHTML = '<span class="image">';
        photoHTML += '<a href="' + photo.link + '">';
        photoHTML += '<img src="' + photo.media.m.replace('_m','_s') + '"></a>';
        $('#photos').append(photoHTML);
    }); // end each
}); // end get JSON

}); // end ready
</script>

и вот код, который работает (показывает фотографии):

<script type='text/javascript' src="jquery-1.6.3.min.js"></script>

<script>
$(document).ready(function() {

var ajaxURL="http://api.flickr.com/services/feeds/groups_pool.gne?id=626753@N20&lang=en-us&format=json&jsoncallback=?"; 
$.getJSON(ajaxURL,function(data) {
    $('h1').text(data.title);
    $.each(data.items,function(i,photo) {
        var photoHTML = '<span class="image">';
        photoHTML += '<a href="' + photo.link + '">';
        photoHTML += '<img src="' + photo.media.m.replace('_m','_s') + '"></a>';
        $('#photos').append(photoHTML);
    }); // end each
}); // end get JSON

}); // end ready
</script>

Я просмотрел Интернет и еще не нашел решения. Если кто-то может пролить свет на этот вопрос, я был бы очень признателен :-).