在ul li中查找所有值

Question

I'm trying to find the list of inner text values of span in a elements within one ul in a div

In other words, having the markup:

<div id="MyId">
   <ul>
      <li><a href="#"><span>Val1</span></a></li>
      <li><a href="#"><span>Val2</span></a></li>
   </ul>
</div>

I'd like to get the array [Val1, Val2] where the div id is my input. I've written some dirty jQuery code involving the each on ul function but it's more complicated than what it should be.

Answer 1

Use .each function

 $('#MyId ul li a span').each(function(){ alert($(this).html()); }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="MyId"> <ul> <li><a href="#"><span>Val1</span></a></li> <li><a href="#"><span>Val2</span></a></li> </ul> </div> 

Answer 2

var myArr = [];

$("#MyId span").each(function() {
    myArr.push($(this).html());
});

This would push in your array the values you want.

//arr = ["Val1", "Val2"]

Having in mind that .html() would actually take everything html-wise inside your span. If you just want the text, then use .text() instead.

Fiddle : https://jsfiddle.net/vdu93x8e/