simple jquery live(click) not working for some reason

If you check out http://social.allthingswebdesign.com, click the "get开发者_如何转开发 social" link and there are 6 icons. I'm trying to make the triangle appear under the icon is clicked.

I started with the code below, but I can't get anything to appear in the console in firebug. What's my deal?

$('.pic').live('click', function() {
    console.log('in here???');
});

I think the problem is very likely to be that that "tabs" plugin is killing your "click" events, preventing them from bubbling up to the body.

edit — it appears that that "tabs" plugin allows you to give it a "click" handler, which should I think return "true" to make it work:

$("ul.idTabs").idTabs({
  click: function() {
    console.log('in here???');
    $('#innest .idTabs li a').remove('#triangle');
    $(this).append('<img id="triangle" src="triangle.png" />');
    return true; // I think
  }
});

I don't know why you'd add all that HTML dynamically. Why not just include it directly into the page and hide it until you need it? It's really messy and error-prone to include lots of markup like that in the middle of your JavaScript code.

Drop idTabs and go with this:

$('.pic').live('click', function(){
  $('.contentArea').hide();
  $('#' + $(this).attr('href')).show();

  // Your triangle logic goes here.
});

It's your idTabs plugin causing the problem, taking that out writes out the console.log.

I tried using the beta version from the dev's website but that continued to stop the rest working.

I would be tempted to write your own jQuery to do what you want, it will only be a few lines compared to a big plugin, and you can be sure it won't mess up anything else.