如何使用jquery和javascript更改div的内容？

我对javascript和jquery还很陌生。我试图旋转包装器div中2个div的内容。一个div包含一张照片，另一个包含一些样式文本（h1、h3、p、span）。这是一个由4个冲浪板组成的画廊，里面有4张照片和4个描述。我一直试图在点击链接时旋转div的内容。包含照片的div旋转良好。我可以在文本div（currentBoard）中获得一个要旋转的描述，但在这之后，唯一要更改的是照片，并且在第一次单击时描述保持静态。因为包含文本的div已经应用了一个类，所以我使用id来旋转内容。这个div的实际内容在css中使用：after和：before，作为这个div的id更改，我正在尝试将内容应用到新id的内容。我只是无法使文本内容div与照片div同步旋转。下面的代码就是我现在拥有的代码，我已经尝试了很多事情。currentBoard是我要更改的文本div中的id。我假设我需要先删除旧id，然后添加新id，但我尝试过的一切都失败了。非常感谢您的帮助。谢谢

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script type="text/javascript">
$(function(evt) {
$("a:has(img.boardGallery)").click(function() {
var largePath = $(this).attr("href");
var caption = $(this).attr("id");
var currentBoard = $("#currentBoard");    
currentBoard.attr({ id: caption });
$("#photo_large").attr({ src: largePath });
return false;       
}); 
}); 
</script>

$（功能（evt）{
$（“a:has（img.boardGallery）”。单击（函数（）{
var largePath=$（this.attr（“href”）；
var caption=$（this.attr（“id”）；
var currentBoard=$（“#currentBoard”）；
currentBoard.attr（{id:caption}）；
$（“#photo_large”）.attr（{src:largePath}）；
返回false；
}); 
}); 

切换ID不会更改div的内容。
如果要更改div中显示的内容，只需在内部html中写入一个新值

下面是一个问题的链接，显示了如何做到这一点：

如果您想让一个div消失，另一个div显示，您应该使用CSS属性并更改“display”属性。您可以在jQuery中使用Show（）和Hide（）实现这一点。以下是一个问题的链接，显示了如何执行此操作：

---

这很有帮助，但是如何让内容在用户单击链接时保持旋转？id确实有效，但仅有效一次。我原以为可以像使用图像旋转器一样使用remove/addClass（）函数，但我对如何编写代码本身感到困惑。使用switch语句和.html（）我能够在单击链接时更改内容。我希望有一个更干净的方法来实现这一点。添加您正在使用的HTML