单击缩略图不会更新主图像

Question

$('#minipics img').click(function(){
        var url = $(this).attr('src');
        $('#mainPic img').attr('src', url);
    });

我有图片库的这个小代码。我想在库下插入jquery选项卡。

所以我有它的HTML：

<div id="tabs">
<ul>
<li><a  href="#tabs-1">პროდუქტის აღწერა</a></li>
<li><a href="#tabs-2">პრომო ვიდეო</a></li>
<li><a href="#tabs-3">მსგავსი პროდუქტი</a></li>
<li><a href="#tabs-4">კომენტარები (0)</a></li>
</ul>
<div id="tabs-1" class="ui-widget-content1">
<p>1</p>
</div>
<div id="tabs-2" class="ui-widget-content1">
<p>2</p>
</div>
<div id="tabs-3" class="ui-widget-content1">
<p>3</p>
</div>
<div id="tabs-4" class="ui-widget-content1">
<p>4</p>
</div>
</div>

我也在插入表ui。

当我插入功能时：

 $(function() {
$( "#tabs" ).tabs();
});

标签工作，但我的图库不起作用。这可能是个问题？ 先谢谢

这是画廊html：

<div id='mainPic'>
        <img src="img/a1.png">
    </div>
        </div>
    <div id='minipics'>
        <img src="img/a1.png">
        <img src="img/a2.png">
        <img src="img/a3.png">
        <img src="img/a4.png">
        <img src="img/a5.png">
        <img src="img/a6.png">
        <img src="img/a7.png">
    </div>