I have 6 links. When i click on any link i get only the first id value
var hrefValue = ''; $(".info_link").click(function () { hrefValue = $(this).attr("id"); console.log('hrefValue : '+hrefValue); }); 
6 Answers
To get the href/id value of a link you do the following:
$('#tgg').on('click','.info_link',function(e) { e.preventDefault(); var hrefValue = this.href;//get the href property of the current clicked element var id = this.id;//get the id property of the current clicked element console.log('hrefValue : ' + hrefValue, 'id:' + id); });<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="tgg"><a class="info_link" id="unique_id" href="http://google.com ">google</a></div>if you want all the ids/hrefs of a particular set of elements then you need a global array variable where you push the id/href of the clicked element
var id = []; $(".info_link").click(function() { id.push(this.id); console.log('ids : ' + id); });<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a class="info_link" id="q">0</a> <a class="info_link" id="q1">1</a> <a class="info_link" id="q2">2</a> <a class="info_link" id="q3">3</a> <a class="info_link" id="q4">4</a>note: you need to delegate your click event if you append the links dynamically
4 Comments
guradio
OP wants ID value
madalinivascu
@guradio the title says href not id
guradio
OP contents states
When i click on any link i get only the first id value.madalinivascu
@guradio i have updated my answer to include the id as well
You need to go through loop. Check with jQuery each.
$(".info_link").each(function () { $(this).click(function (){ hrefValue = $(this).attr("id"); console.log('hrefValue : '+hrefValue); }); }); 
Comments
$(".info_link").click(function () { var hrefValue = $(this).attr("id"); console.log('hrefValue : '+hrefValue); });<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <a class="info_link" id="q">asd</a> <a class="info_link" id="q1">asd</a> <a class="info_link" id="q2">asd</a> <a class="info_link" id="q3">asd</a> <a class="info_link" id="q4">asd</a>Put the initialization of var hrefValue = $(this).attr("id"); inside click
Comments
Use below code and dont forget to include jquery library
<script> $(document).ready(function(){ $(".test").click(function(evt){ var hrefValue = $(this).attr("id"); console.log('hrefValue : '+hrefValue); }); }); </script> <div class="test" id="testDiv1">div1</div> <div class="test" id="testDiv2">div2</div> <div class="test" id="testDiv3">div2</div> <div class="test" id="testDiv4">div2</div>strong text <div class="test" id="testDiv5">div2</div> 
Comments
If I understood your question correctly here is a solution :
<a href="http://example.com" data-value="something" id="same_id_for_all_urls">Click me </a> $('#same_id_for_all_urls').click(function(e) { e.preventDefault(); var valueOfLink = $(this).data('value'); console.log(valueOfLink); }) 
Comments
Not exactly sure what you're trying to do here but this is how you can get all the href and id of .info_link.
If HTML sample is given, the Javascript code can be optimized for your use case. It is unfortunately unavailable so I have to make assumption on this part.
var txngg = function () { }; (function($, window, document) { $('#tgg').on('click', '.info_link', function() { var values = []; $(this).parent().find('.info_link').each(function(i, e) { var $e = $(e); values.push({ "href": $e.attr('href'), "id": $e.attr('id') }); }); console.log(values); return false; }); })(jQuery, window, document);#tgg a { display: block; line-height: 150%; }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="tgg"> <a href="#a" class="info_link" data-toggle="collapse" id="a" data-target="#tuthtstory" onclick="txngg()" title="Click to view Validation Result">a</a> <a href="#b" class="info_link" data-toggle="collapse" id="b" data-target="#tuthtstory" onclick="txngg()" title="Click to view Validation Result">b</a> <a href="#c" class="info_link" data-toggle="collapse" id="c" data-target="#tuthtstory" onclick="txngg()" title="Click to view Validation Result">c</a> <a href="#d" class="info_link" data-toggle="collapse" id="d" data-target="#tuthtstory" onclick="txngg()" title="Click to view Validation Result">d</a> <a href="#e" class="info_link" data-toggle="collapse" id="e" data-target="#tuthtstory" onclick="txngg()" title="Click to view Validation Result">e</a> <a href="#f" class="info_link" data-toggle="collapse" id="f" data-target="#tuthtstory" onclick="txngg()" title="Click to view Validation Result">f</a> </div>
var hrefValue = '';put it inside clickid