jQuery get anchor value

Question

I am trying to get the value of a clicked anchor but I am not sure which anchor is being clicked or how to latch onto it with jquery. I have a document.ready function

$(document).ready(function () {
var ActiveBlogStats = $('#BlogSelectList');
$('#BlogSelectList').click(function () {
    alert(ActiveBlogStats.text)
}); })

Here is the id that it is working on

<ul class="submenu" id="BlogSelectList">
  <xsl:for-each select="oohru/user/oohblog">
    <li>
      <a>
        <xsl:attribute name="href">#<xsl:value-of select="normalize-space(blogid)"/></xsl:attribute>
        <xsl:value-of select="oohblogurl"/>
      </a>
    </li>
  </xsl:for-each>
<li><a href="AddNewBlog.aspx">+ Create a new oohblog</a></li>
</ul>

How can I get the href of the actual anchor being clicked? I don't see how to make a document.ready even for items that don't exist until after the document is ready. I suppose I could get the # value from the URL since when they click one it will update the URL but I would rather get it directly from the click.

Answer 1

If your content is dynamically generated, you may want to look into .live() (or delegate()) ( http://api.jquery.com/live/ | http://api.jquery.com/delegate/)

Your code would then look something like:

    $("#BlogSelectList li a").live('click', function () {
        //do something
    });