Find HTML Element that has Specific Attribute Using jQuery

Question

How can I target an HTML element that has a specific attribute, but when that attribute has no value (well, whether it has a value or not). I've found others asking similar questions about elements with attribute values but not based on existence of the attribute itself.

For example, with this HTML:

<div id="id1">
  <div class="c1"></div>
  <div class="c2" an-attribute ></div>
  <div class="c3"></div>
</div>

How might I go about finding the div within #id1 that has the attribute an-attribute? I can't count on it being in a particular location related to the other divs but can count on it being in #id1.

Something like: $('#id1 *[an-attribute]');

Evan Trimboli
– Evan Trimboli

2016-06-08 04:56:15 +00:00
Commented Jun 8, 2016 at 4:56 — Evan Trimboli
– Evan Trimboli, Commented Jun 8, 2016 at 4:56

phreakv6 · Accepted Answer · 2016-06-08 04:57:12Z

5

Try this.

$('#id1 div[an-attribute]');

answered Jun 8, 2016 at 4:57

phreakv6

2,1651 gold badge11 silver badges11 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Spencer Wieczorek · Accepted Answer · 2016-06-08 04:57:23Z

3

You can simply use an attribute selector:

$('div[an-attribute]') // or $('[an-attribute]')

answered Jun 8, 2016 at 4:57

Spencer Wieczorek

21.7k7 gold badges46 silver badges57 bronze badges

Comments

Prakash Bhandari · Accepted Answer · 2016-06-08 05:02:20Z

0

Here is sample code. i have used to identify the attribute.

HTML Code

<div id="id1">
        <div class="c1"></div>
        <div class="c2" id="testr">dd</div>
        <div class="c3"></div>
    </div>

JavaScript Code

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>
    $('.c2').on('click',function(){
        var id =$(this).attr('id')
        alert(id);
    })
</script>

answered Jun 8, 2016 at 5:02

Prakash Bhandari

5678 silver badges16 bronze badges

Comments

Toney · Accepted Answer · 2016-06-08 05:02:31Z

0

alert($('[an-attribute]').attr('class'));

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
  <body>
    <div an-attribute class="111111111"></div>
  </body>
</html>

answered Jun 8, 2016 at 5:02

Toney

661 bronze badge

Comments

Mani · Accepted Answer · 2016-06-08 05:04:55Z

0

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
							
<script>
$(document).ready(function(){

	$('[an-attribute]').css("color","red")

});
</script>

<div id="id1">
  <div class="c1">dsadsa1</div>
  <div class="c2" an-attribute >dsdsads2</div>
  <div class="c3">dsadsad3</div>
</div>

answered Jun 8, 2016 at 5:04

Mani

2,6552 gold badges23 silver badges44 bronze badges

Comments

Dharmesh Kumar Laxkar · Accepted Answer · 2016-06-08 05:23:42Z

0

var element=$('#id1').find('div[an-attribute]');

answered Jun 8, 2016 at 5:23

Dharmesh Kumar Laxkar

4214 silver badges8 bronze badges

1 Comment

potame Over a year ago

Please consider adding some explanations

RJParikh · Accepted Answer · 2016-06-08 10:42:18Z

0

$("div").children().attr("an-attribute");

edited Jun 8, 2016 at 10:42

RJParikh

4,1661 gold badge24 silver badges38 bronze badges

answered Jun 8, 2016 at 4:55

Naga Sai A

11k1 gold badge24 silver badges41 bronze badges

1 Comment

Michael Gaskill Over a year ago

This doesn't actually answer the question. This code will retrieve the value of an attribute if you've already found an element. The OP was asking how to find an element based on whether an element has an attribute.

Collectives™ on Stack Overflow

Find HTML Element that has Specific Attribute Using jQuery

7 Answers 7

Comments

Comments

Comments

Comments

Comments

1 Comment

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

7 Answers 7

Comments

Comments

Comments

Comments

Comments

1 Comment

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related