Javascript-使用onclick更改div内容

Javascript-使用onclick更改div内容,javascript,Javascript,我需要有关使用onclick函数更改内容的帮助 我得到了一个包含如下3个链接的表 <table class="galerimenu" name="gallerytype"> <tr> <td ><a href="#" class="tattoo">Tattoo</a></td> <td ><a href="#" class="piercing">Piercing

我需要有关使用onclick函数更改内容的帮助

我得到了一个包含如下3个链接的表

<table class="galerimenu" name="gallerytype">
    <tr>
        <td ><a href="#" class="tattoo">Tattoo</a></td>
        <td ><a href="#" class="piercing">Piercing</a></td>
        <td ><a href="#" class="makeup">Makeup</a></td>
    </tr>
  </table>


The content that i need to call is a thumbnail gallery in div like ;

<div class="banner" id="tattoo">
    <ul>
         <li>
            <ul id='da-thumbs' class='active-da-thumbs da-thumbs'>
                <li>
                  <a class="swipebox" data-title="Image Title" href="demo/1.jpg">
                  <img src="demo/1.jpg" alt="image" /></a>
                 </li>
                 <li>
                  <a class="swipebox" data-title="Image Title" href="demo/1.jpg">
                  <img src="demo/1.jpg" alt="image" /></a>
                 </li>
                 <li>
                  <a class="swipebox" data-title="Image Title" href="demo/1.jpg">
                  <img src="demo/1.jpg" alt="image" /></a>
                 </li>
    </ul>
      </li>
  </div>

<div class="banner" id="piercing" style="display:none;">
    <ul>
         <li>
            <ul id='da-thumbs' class='active-da-thumbs da-thumbs'>
                <li>
                  <a class="swipebox" data-title="Image Title" href="demo/1.jpg">
                  <img src="demo/1.jpg" alt="image" /></a>
                 </li>
                 <li>
                  <a class="swipebox" data-title="Image Title" href="demo/1.jpg">
                  <img src="demo/1.jpg" alt="image" /></a>
                 </li>
                 <li>
                  <a class="swipebox" data-title="Image Title" href="demo/1.jpg">
                  <img src="demo/1.jpg" alt="image" /></a>
                 </li>
    </ul>
      </li>
  </div>

<div class="banner" id="makeup" style="display:none;">
    <ul>
         <li>
            <ul id='da-thumbs' class='active-da-thumbs da-thumbs'>
                <li>
                  <a class="swipebox" data-title="Image Title" href="demo/1.jpg">
                  <img src="demo/1.jpg" alt="image" /></a>
                 </li>
                 <li>
                  <a class="swipebox" data-title="Image Title" href="demo/1.jpg">
                  <img src="demo/1.jpg" alt="image" /></a>
                 </li>
                 <li>
                  <a class="swipebox" data-title="Image Title" href="demo/1.jpg">
                  <img src="demo/1.jpg" alt="image" /></a>
                 </li>
    </ul>
      </li>
  </div>

像这样的方法应该会奏效:

$('a.tattoo').click( function() {
    $('#tattoo').toggle();
});

帮助。。。?到目前为止你尝试了什么?我忘了写js代码。现在编辑它。请你再检查一下好吗?这就是我要找的,伙计。谢谢。它在我的页面上不起作用,可能有一些js代码崩溃,但我会尝试修复它。再次感谢。
$('a.tattoo').click( function() {
    $('#tattoo').toggle();
});
$('.tattoo').click(function () {
    $('.banner').hide();
    $('#tattoo').show();
});
$('.piercing').click(function () {
    $('.banner').hide();
    $('#piercing').show();
});
$('.makeup').click(function () {
    $('.banner').hide();
    $('#makeup').show();
});