jQuery cannot find class element from some html returned via ajax call

Question

I am running an ajax call that returns some HTML as a string. For the purpose of this question I will call this <div class='abc'>ABC123</div> when I get this back I want to check and see if the class "abc" has a value and what that value is. However when I run a .find() I cannot find the class, I can find the div, but not the specific class. Just using the div is not adequate because in the real live code the HTML is very complex and has many divs and classes. Below is some JS that illustrates my point.

var x = "<div class='abc'></div>"; 
$(x).hasClass("abc"); // returns true
$(x).find(".abc"); // Returns empty array

Why is it that the first line returns true, but the selector cannot find the element?

Thanks!

Venkata Krishna · Accepted Answer · 2015-02-11 20:53:32Z

3

Because $x is the div with class abc.

jquery .find() tries to find any children within the div.abc with class abc which it won't find.

This is more like it.

var x = "<div class='abc'><div class='def'></div></div>"; 
$(x).hasClass("abc"); // returns true
$(x).find(".def"); // returns $('div.def')

answered Feb 11, 2015 at 20:53

Venkata Krishna

15.2k5 gold badges45 silver badges57 bronze badges

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

1 Comment

rknudson Over a year ago

That seems to be the issue. Thanks!

Jérémie Bertrand · Accepted Answer · 2017-05-30 07:38:52Z

0

When we append html element to the page, sometimes JQuery can't find this element due to parent and child relationship.

For example: a button having class submit inside a div having id append_area and we want to run a function on click on this button. Then we can use the below code.

HTML Code:

<div id="append_area">
</div>

Jquery Code:

$("#results").delegate('.submit', 'click', function(){ });

edited May 30, 2017 at 7:38

Jérémie Bertrand

3,1393 gold badges48 silver badges55 bronze badges

answered May 30, 2017 at 7:03

Santosh Devnath

1

Collectives™ on Stack Overflow

jQuery cannot find class element from some html returned via ajax call

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related