user3674364
user3674364

Reputation: 69

How to retrieve the attribute for a class

I have got a HTML as shown below

<div id="activeui4" class="activateUiHTML" data-role="collapsible">
    <div class="Topping-and-Crusting-section">
        <a style="display:block" id="4" vendor_items_id="4" class="btn  btn-sm topp  btn-sm-active" data-count="1">topping  <span>1</span></a> 
        <a style="display:block" id="4" vendor_items_id="4" class="btn  btn-sm crust " data-count="0"> crust  <span></span></a>                
    </div>
</div>

I am trying to retrieve the value data-count of class btn btn-sm topp btn-sm-active

I tried it like this:

var count = $(".activateUiHTML div#"+id_attr_val+".Topping-and-Crusting-section").find(".top").attr('data-count');
alert(count);

But I get back undefined.

Upvotes: 1

Views: 62

Answers (5)

Pankaj Sharma
Pankaj Sharma

Reputation: 1853

Cause : you are using wrong selector. class name is "topp" rather then "top".

so resolution is to change class name

var count = $(".activateUiHTML div#"+id_attr_val+".Topping-and-Crusting-section").find(".topp").data('count');

Future problem: there are 2 anchors with same class "top" so it will return data count from first element it found. so be specific . either use id or some specific class in "div"

Upvotes: 0

vimalpt
vimalpt

Reputation: 543

You miss spelled the class find('.top') theres no such element instead use .find('.topp')

use data function of jquery

var count = $(".activateUiHTML div#"+id_attr_val+".Topping-and-Crusting-section").find(".top").data('count');

Upvotes: 1

kefy
kefy

Reputation: 535

Here your problem in this line

class="btn  btn-sm topp  btn-sm-active"

in your javascript you called it as .top but in your html you have .topp

.find(".top")

Upvotes: 0

Viswanath Donthi
Viswanath Donthi

Reputation: 1821

Here's the code:

var count = $("#activeui4 a.btn-sm-active").attr('data-count');

Upvotes: 0

RGS
RGS

Reputation: 5211

var count = $(".activateUiHTML .Topping-and-Crusting-section").find(".topp").data('count');
alert(count);

Your class selector 'top' is misspelled.

Demo:

http://jsfiddle.net/j0bo063s/

Upvotes: 3

Related Questions