jQuery：CSS 隱藏物件，點擊顯示

這樣寫CSS、jQuery可能不是最正確的，但我只會基本寫法，先記錄下來
產品選單： [ebike]、[bicycle]、[racket]、[ski]
有共通的 css=”gallery-item-thumbnail-wrap”
點擊所選的產品後顯示相關說明並隱藏其他產品說明

/*自訂css內容，ebike、bicycle、racket、ski的描述預設全隱藏*/
.ebike,.bicycle,.racket,.ski {
    display:none;
}

/*----------自訂js內容----------*/
<script>
jQuery(document).ready(function( $ ){
##點ebike，顯示ebike詳細說明，其他隱藏
jQuery(".gallery-item-thumbnail-wrap:eq(0)").click(function(){
jQuery(".ebike").css("display","inline");
jQuery(".bicycle,.racket,.ski").css("display","none");
});
jQuery(".gallery-item-thumbnail-wrap:eq(1)").click(function(){
jQuery(".ebike,.racket,.ski").css("display","none");
jQuery(".bicycle").css("display","inline");
});
jQuery(".gallery-item-thumbnail-wrap:eq(2)").click(function(){
jQuery(".ebike,.bicycle,.ski").css("display","none");
jQuery(".racket").css("display","inline");
});
jQuery(".gallery-item-thumbnail-wrap:eq(3)").click(function(){
jQuery(".ebike,.bicycle,.racket").css("display","none");
jQuery(".ski").css("display","inline");
});
});
</script>