I have html code like this:
<li id="vol" rel="1">
// something here
</li>
<li id="vol" rel="2">
// something here
</li>
<li id="vol" rel="3">
// something here
</li>
I'm try to get rel attribute by this code:
$('#vol').click(function(){
var rel = $(this).attr('rel');
});
But it's not working. I also change this
to #vol
, but it didn't work.
What should i do?
By Not working, I'm assuming that any li
you click, gives you back 1
, this is caused by having multiple ID in a page. IDs are supposed to be unique, use class instead.
try
<li class="vol" rel="1">
// something here
</li>
<li class="vol" rel="2">
// something here
</li>
<li class="vol" rel="3">
// something here
</li>
JS:
$('.vol').click(function(){
var rel = $(this).prop('rel');
});
Your all id
are same.So make different them.
Assuming that your li
is inside ul
which class is clsTest
$('.clsTest li').click(function(){
var rel = $(this).attr('rel');
alert(rel);
});
Selector by "id" (#id) select only one element, use "class" (.class) instead
Change your code to
<li class="vol" rel="1">
// something here
</li>
<li class="vol" rel="2">
// something here
</li>
<li class="vol" rel="3">
// something here
</li>
<script>
$('body').delegate('li.vol','click',function(){
var rel = $(this).attr('rel');
});
</script>
$('.li').on('click', function(){
var target = $(this).attr('rel');
});
i think we directly try with element if you have using li