CODEWITHSUNDEEP
javascriptjqueryhtml
user3930976
user3930976

Reputation: 171

How to extract text from all elements of given class under given HTML element with jQuery

When I do this:

var elem = $(".region_box");
text = elem.find(".my_text").html();

I can get text from the first element deep below "elem" with class "my_text" which it finds.

But there are many elements of the class "actual_text" below elem and I want to combine the text from all of them. How would I do it? I am new to jQuery and I searched around for solution for long time, but neither of them worked for me. Perhaps I am using this each() function incorrectly. I would very much appreciate any help.

Upvotes: 0

Views: 1824

Answers (3)

Lumi Lu
Lumi Lu

Reputation: 3305

try something using jquery .map() method like this,

text = $('.region_box').find('.my_text').map(function() {
  return $(this).text();
}).get().join(',');

As the site said, "As the return value is a jQuery object, which contains an array, it's very common to call .get() on the result to work with a basic array."

Upvotes: 2

user4639281
user4639281

Reputation:

Define a variable to hold the new string, select all of the elements you wish to extract, chain that with .each() and add the contents of the text node for that element to the variable you created to hold the new string.

(Demo)

var text = "";
$(".region_box .my_text").each(function(){ text += " " + $(this).text(); });

Upvotes: 2

Victory
Victory

Reputation: 5890

You can use the jQuery.each

var text = '';

var elms = $(".region_box .my_text").each(function () {
    text = text + $(this).text(); // use .html() if you actually want the html
});

Upvotes: 3

Related Questions