How to get text of element in a variable using jquery?

Question

var markup = '<div class="ExternalClass34E9F553C2F74AA2B6D693A07BA166AC">Employee Self-Service pages have been corrected but may require you to refresh the page.</div><div class="ExternalClass34E9F553C2F74AA2B6D693A07BA166AC">&#160;</div><div class="ExternalClass34E9F553C2F74AA2B6D693A07BA166AC">If the problem remains, follow <a href="/Shared%20Documents/EBS%20Page%20Refresh%20Instructions_rkc.pdf">these instructions</a>. &#160;</div>';           
var str = "";
$(markup).find("div[class^='ExternalClass']").each(function(){
    str += $(this).text();
})

How do I grab content of all the divs in the markup that starts with ExternalClass?

Do you want to parse HTML or a javascript string? Because you say you want to parse the string, but your jQuery selector looks like you're parsing HTML nodes. — Danmoreng
– Danmoreng, Commented Oct 10, 2016 at 15:44
Sorry just realised the class isn't 'ExternalClass' but begins with External Class. But then this just makes me wonder why you have so many classes, that all start with ExternalClass and all use really complex names? — DibsyJr
– DibsyJr, Commented Oct 10, 2016 at 15:53
@DibsyJr I have absolutely no control over the markup- controls emit the markup like that.. — Athapali
– Athapali, Commented Oct 10, 2016 at 16:01

Mohammad · Accepted Answer · 2016-10-10 16:52:14Z

2

$(markup) selector contain all ExternalClass class and you can't use .find() because it doen't any matched child. You need to use .filter() to filter selected element.

var markup = "<div...";
var str = "";
$(markup).filter("div[class^='ExternalClass']").each(function(){
    str += $(this).text();
})

var markup = '<div class="ExternalClass34E9F553C2F74AA2B6D693A07BA166AC">Employee Self-Service pages have been corrected but may require you to refresh the page.</div><div class="ExternalClass34E9F553C2F74AA2B6D693A07BA166AC">&#160;</div><div class="ExternalClass34E9F553C2F74AA2B6D693A07BA166AC">If the problem remains, follow <a href="/Shared%20Documents/EBS%20Page%20Refresh%20Instructions_rkc.pdf">these instructions</a>. &#160;</div>';
$(markup).filter("div[class^='ExternalClass']").each(function(){
    console.log($(this).text());
})

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

answered Oct 10, 2016 at 16:52

Mohammad

21.5k16 gold badges58 silver badges86 bronze badges

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

1 Comment

Danmoreng Over a year ago

That actually would be the correct answer here. Mine is bad in comparison.

Danmoreng · Accepted Answer · 2016-10-10 15:58:45Z

jQuerys .find() only loops through the children of the specific HTML you selected. Your variable markup has no children with the fitting class selector. The easiest way I can imagine getting this solved, is to wrap all you have in markup inside another div, and then use your jQuery selector - that works:

var markup = '<div class="ExternalClass34E9F553C2F74AA2B6D693A07BA166AC">Employee Self-Service pages have been corrected but may require you to refresh the page.</div><div class="ExternalClass34E9F553C2F74AA2B6D693A07BA166AC">&#160;</div><div class="ExternalClass34E9F553C2F74AA2B6D693A07BA166AC">If the problem remains, follow <a href="/Shared%20Documents/EBS%20Page%20Refresh%20Instructions_rkc.pdf">these instructions</a>. &#160;</div>';
markup = '<div>' + markup + '</div>';
var str = "";
$(markup).find("div[class^='ExternalClass']").each(function(){
    str += $(this).text();
})

Collectives™ on Stack Overflow

How to get text of element in a variable using jquery?

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