selector in jquery - get rel attribute

jquery select element by rel attribute
rel html
data-rel
rel on a tag
rel property in html
anchor rel tag
link rel tag in html
rel=external

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');
});

jQuery Examples - $("a[@rel]"), jQuery Examples - $("a[@rel]") Description. "$("a[@rel]")" Selects all elements matched by <a> that have a rel attribute. Syntax. Here is the simple syntax to use this selector − $("element[attribute]") Parameters. Here is the description of all the parameters used by this selector − Returns. Example. In jQuery, the attribute selectors are wrap inside a bracket []. Here’s the supported attribute selectors : 1. Has Attribute [A] Select all elements that have the “A” attribute. Examples $(‘a[rel]’) – selects all elements matched by <a> that have a rel attribute.

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);
});

jQuery - Attribute selector examples, Attribute Value Equals [A=B]. Select all elements that have the A attribute with a value exactly equal to B. Examples $('a[rel=nofollow]') – selects  escaped double quotes inside double quotes: $("a[rel=\"nofollow self\"]") The variation you choose is generally a matter of style or convenience. Note: In jQuery 1.3 [@attr] style selectors were removed (they were previously deprecated in jQuery 1.2). Simply remove the "@" symbol from your selectors in order to make them work again.

Selector by "id" (#id) select only one element, use "class" (.class) instead

HTML a rel Attribute, Tip: Search engines can use this attribute to get more information about a link. Syntax. <a rel="value">. Attribute Values. Value, Description. alternate  jQuery Selectors. Use our jQuery Selector Tester to demonstrate the different selectors. All elements with a title attribute value equal to 'Tomorrow', or

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>

selector in jquery, selector in jquery - get rel attribute. jquery select element by rel attribute rel html rel on a tag data-rel rel property in html link rel tag in html anchor rel tag rel=  Definition and Usage. The rel attribute specifies the relationship between the current document and the linked document. Only used if the href attribute is present.

$('.li').on('click', function(){
  var target = $(this).attr('rel');
});

i think we directly try with element if you have using li

Attribute, double quotes inside single quotes: $('a[rel="nofollow self"]'); single quotes Selects elements that have the specified attribute with a value either equal to a  The name of the attribute to get. The .attr () method gets the attribute value for only the first element in the matched set. To get the value for each element individually, use a looping construct such as jQuery's .each () or .map () method. Using jQuery's .attr () method to get the value of an element's attribute has two main benefits:

(this + "option:selected").attr("rel") option selected is , P.S.: you can't add a dom element to the string selector getting the rel attribute from this collection returns attr value from the first element only. Also in: Selectors > Attribute | Selectors > jQuery Extensions Attribute Not Equal Selector [name!=”value”] Select elements that either don’t have the specified attribute, or do have the specified attribute but not with a certain value.

jQuery Get Attribute, Set Attribute, Remove Attribute, jQuery get attribute, jQuery set attribute, jQuery remove attribute, jQuery attr, jQuery is through the attributes and properties of the HTML DOM elements. The most common properties include the class name, tag name, id, href, title, rel,  jQuery [attribute$=value] Selector jQuery Selectors. Example. The [attribute$=value] selector selects each element with a specific attribute, with a value ending

HTML rel attribute - HTML tutorials, HTML rel attribute supports a and link elements. Syntax <ElementName rel="​value" >..</ElementName>. Where ElementName is any supported  Description: Selects elements that have the specified attribute with a value exactly equal to a certain value. version added: 1.0 jQuery( "[attribute='value']" ) attribute: An attribute name. value: An attribute value. Can be either a valid identifier or a quoted string. Example:

Comments
  • can't use same id multiple times.
  • ...and if you fix that it will all work fine.
  • By not working, I suppose only the first li would have a click listener bound to it at all.
  • use delegate or on if you want to attach the event dynamically