< Back to Code

Create Tab content with simple jquery


Content 1
Content 2
Content 3
				
					<button class="btn1">1</button>
<button class="btn2">2</button>
<button class="btn3">3</button>
<hr>
<div class="content content1">Content 1</div>
<div class="content content2">Content 2</div>

<div class="content content3">Content 3</div>

<script>
    $(document).ready(function(){
       $(".content").hide();
       
        $(".btn1").on("click",function(){
            $(".content").hide();
           $(".content1").fadeIn();
       });
       
        $(".btn2").on("click",function(){
            $(".content").hide();
           $(".content2").fadeIn();
       });
       
        $(".btn3").on("click",function(){
            $(".content").hide();
           $(".content3").fadeIn();
       });
    });
    
</script>
				
			
vi

© Copyright by JAYbranding – All rights reserved.