Question

I’ve got a list of OpenID’s, and I’d like to populate an input field based on the sending anchor.

Basically the goal will be to populate the input with “Google” if the first button is clicked, “Yahoo!” for the second, etc.

Does anyone know how I would do this?

            <div>
                <div class="openid openid_large_btn google-large"> <a href="#" class="openid_btn" ><span>Google</span></a></div>
                <div class="openid openid_large_btn yahoo-large"><a href="#" class="openid_btn" ><span>Yahoo!</span></a></div>
                <div class="openid openid_large_btn myopenid-large"><a href="#" class="openid_btn"><span>myOpenID</span></a></div>
                <div class="openid openid_large_btn aol-large"><a href="#" class="openid_btn"><span>AOL</span></a></div>
                <div class="openid openid_large_btn facebook-large"><a href="#" class="openid_btn"><span>facebook</span></a></div>
            </div>

<script>
    $('.openid_btn').click(function () {

//I'd like to set this to the info contained within the <span> tags
        $("#openid_identifier").val("???"); 


        $('#OpenIDForm').submit();
    });
</script>

Answer 1

Like this

$('.openid_btn').click(function () { 
    $("#openid_identifier").val($("span", $(this)).text());  
    $('#OpenIDForm').submit(); 
});