jQuery find element in variable

Question

I have:

var html_data = '<div class="div1">something</div><div id="this_is_it">Hello!</div>';

How do I check if the html_data var has div this_is_it ?

Trying to check using

if($(html_data).find('#this_is_it').length)

but is not working....

Your string isn't properly quoted

j08691
– j08691

2016-06-03 18:28:05 +00:00
Commented Jun 3, 2016 at 18:28 — j08691
– j08691, Commented Jun 3, 2016 at 18:28

Barmar · Accepted Answer · 2016-06-03 19:15:41Z

11

.find() only searches children of the elements it's given, not the top-level elements. So you need to wrap everything in another <div>. Also, you need to fix the quoting problem that causes a syntax error -- if you use double quotes inside the string, use single quotes to delimit it, or vice versa (or escape the quotes).

var html_data = '<div class="div1">something</div><div id="this_is_it">Hello!</div>';
if ($("<div>" + html_data + "</div>").find("#this_is_it").length) {
  console.log("found");
} else {
  console.log("not found");
}

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

edited Jun 3, 2016 at 19:15

answered Jun 3, 2016 at 18:34

Barmar

789k57 gold badges555 silver badges669 bronze badges

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

2 Comments

Parvez Rahaman Over a year ago

Showing error on chrome 'VM210:48 Uncaught SyntaxError: missing ) after argument list'

Barmar Over a year ago

Sorry, had a typo, missing a +.

KpTheConstructor · Accepted Answer · 2016-06-03 19:02:58Z

2

If you would just like to run a check just use indexOf() .

Example 1 :

var html_data = '<div class="div1">something</div><div id="this_is_it">Hello!</div>';

document.write(html_data.indexOf("this_is_it") > 1 ? true : false)

OR

Example 2:

FYI: Checking if length of this_is_it is greater than 1.

if(html_data.indexOf("this_is_it") > 1){

//do something here

}

Hope this helps..

answered Jun 3, 2016 at 19:02

KpTheConstructor

3,2991 gold badge16 silver badges24 bronze badges

Comments

terpinmd · Accepted Answer · 2016-06-03 18:37:00Z

1

First as the other posters said your quotations are not right...try this:

var html_data = '<div class="div1">something</div><div id="this_is_it">Hello!</div>';

Secondly you need to use filter in this case. Find looks through children elements only where as filter applies to all the elements.

var one = $(html_data).filter ('#this_is_it').length;

var zero = $(html_data).find('#this_is_it').length;

Your html structure in this case is flat so use filter (or first).

answered Jun 3, 2016 at 18:37

terpinmd

1,0189 silver badges16 bronze badges

Comments

Parvez Rahaman · Accepted Answer · 2016-06-03 19:16:02Z

1

Try this..

var html_data = '<div class="div1">something</div><div id="this_is_it">Hello!</div>';

if(html_data.indexOf("this_is_it")){
    console.log(true);
}else{
    console.log(false);
}

answered Jun 3, 2016 at 19:16

Parvez Rahaman

4,3973 gold badges24 silver badges39 bronze badges

Comments

DIEGO CARRASCAL · Accepted Answer · 2016-06-03 21:28:17Z

1

Your problem is in the use of quotations...

it should be structured like:

var html_data = "<div class='div1'>something</div><div id='this_is_it'>Hello!</div>";

or if div1 and this_is_it are variables, then:

var html_data = "<div class="+div1+">something</div><div id="+this_is_it+">Hello!</div>";

Then if($(html_data).find('#this_is_it').length); should give you a result... or if variables: if($(html_data).find('#'+this_is_it).length)

Also terpinmd make a great point in the comments, so for it to work with find() it should be inside a wrapper element. He recommends the use of filter(), which works great. Thank you terpinmd.

edited Jun 3, 2016 at 21:28

answered Jun 3, 2016 at 18:29

DIEGO CARRASCAL

2,12916 silver badges16 bronze badges

2 Comments

terpinmd Over a year ago

find only works if there are child elements. using filter or first is the solution...see my post.

DIEGO CARRASCAL Over a year ago

I couldn't tested, but thought it could guide him in the right direction. That's why I write should give you a result..., but then again you are right $(html_data) is not a document or complete DOM. good clarification, I'll included in my answer.

Marco Aurlio Moreira dos Anjos · Accepted Answer · 2016-06-03 18:29:27Z

-1

I think you can't use find() to a variable on javascript, you may need to put in your html code and then you get it by find()

answered Jun 3, 2016 at 18:29

Marco Aurlio Moreira dos Anjos

789 bronze badges

1 Comment

Barmar Over a year ago

jQuery returns an object whose HTML contents come from the variable. Why wouldn't you be able to use find() on it?

Collectives™ on Stack Overflow

jQuery find element in variable

6 Answers 6

2 Comments

Comments

Comments

Comments

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

2 Comments

Comments

Comments

Comments

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related