Tabs example

Tabs example

I am trying this example (http://code-tricks.com/create-a-simple-html5-tabs-using-jquery/) in JSfiddler and it works fine. Problem is adding to my web page...
I think JSFiddler is running everything..
Do I need to add a bit of code to run the JS page onload? How do I do this...

it works in JSFiddle but not in my webpage...there is something I am missing

http://jsfiddle.net/Jaykapalczynski/3pgua/1/


In my website: 

This is what I am trying in HTML
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
  6. <meta http-equiv="X-UA-Compatible" content="IE=edge">

  8. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  9. <script src="html5jtabs.js"></script>

  11. <script>

  13. $(document).ready(function() {
  14.   $(".tabs a").html5jTabs();
  15. });

  17. </script>

  19. </head>

  21. <body Class="tundra">

  23. <div id="master-wrapper">

  25.   
  26. <div class="tabs">
  27.     <a data-toggle="tab1">Tab1</a>
  28.     <a data-toggle="tab2">Tab2</a>
  29.     <a data-toggle="tab3">Tab3</a>
  30.     <a data-toggle="tab4">Tab4</a>
  31.     <a data-toggle="tab5">Tab5</a>
  32. </div>
  33. <div class="tabContent">  
  34.   <div id="tab1">
  35. <h5>Tab1</h5> 
  36.   </div> 
  37.   <div id="tab2"> 
  38.     <h5>Tab2</h5>
  39.   </div>
  40.   <div id="tab3">
  41.     <h5>Tab3</h5>
  42.   </div>
  43.   <div id="tab4">
  44.     <h5>Tab4</h5>
  45.   </div>
  46.   
  47.   <div id="tab5">
  48.     <h5>Tab5</h5>
  49.   </div>
  50. </div>

  52. </div>
  53. </body>
  54. </html>


This is my JS page
  1. ;(function($){
  2.   $.fn.html5jTabs = function(options){
  3.     return this.each(function(index, value){
  4.       var obj = $(this),
  5.       objFirst = obj.eq(index),
  6.       objNotFirst = obj.not(objFirst);
  7.       
  8.       $("#" +  objNotFirst.attr("data-toggle")).hide();
  9.       $(this).eq(index).addClass("active");
  10.       
  11.       obj.click(function(evt){
  12.         
  13.         toggler = "#" + obj.attr("data-toggle");
  14.         togglerRest = $(toggler).parent().find("div");
  15.         
  16.         togglerRest.hide().removeClass("active");
  17.         $(toggler).show().addClass("active");

  19.         //toggle Active Class on tab buttons
  20.         $(this).parent("div").find("a").removeClass("active");
  21.         $(this).addClass("active");

  23.         return false; //Stop event Bubbling and PreventDefault
  24.       });
  25.     });
  26.   };
  27. }(jQuery));