Calling a function when a tab is clicked

Calling a function when a tab is clicked

I need to call a function when a tab is clicked. So I tried starting out with a basic alert when a tab is clicked.

My html is as follows

<div id="tabs">
  <ul>
    <li><a href="#tab1">Tab1</a></li>
    <li><a href="#tab2">Tab2</a></li>
    <li><a href="#tab3">Tab3</a></li>
  </ul>

  <div id="tab1">
    <p>Tab1 contets</p>
  </div>
  <div id="tab2">
    <p>Tab2 contets</p>
  </div>
  <div id="tab3">
    <p>Tab3 contets</p>
  </div>

</div>


And my javascript is as follows

$('#tabs').tabs().click(function() {
   alert("You clicked a tab");
});


I've been reading around a lot but can't find any examples that help me solve this.

Can anyone give me an idea of why this code isn;t working.

Thanks for any help given.