Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Jquery: Traversing li and get element within

This question seems easy but I just can't get it right.

<ul id="myUL">
   <li id="item1">
      <select class="partDesc"><option>Front</option><option>Rear</option></select>
      <input type="text" class="itemDesc">
      <img src="images/myimg.jpg" class="itemImg" > 
   </li>
   <li id="item2">
      <select class="partDesc"><option>Front</option><option>Rear</option></select>
      <input type="text" class="itemDesc">
      <img src="images/myimg.jpg" class="itemImg" > 
   </li>
</ul>

These <li> items are dynamically added using jquery. I want to traverse these <li> items and get all the inputs, including selected value from partDesc, text from itemDes and src from itemImg.

Here is where I stuck:

$("#myUL li").each(function() {<br>
    var partDesc = $(this).??;<br>
    var itemDesc = $(this).??;<br>
    var itemImg = $(this).??;<br>
 });

Thank you for reading.

like image 439
Dreteh Avatar asked Dec 18 '25 01:12

Dreteh


1 Answers

following script should help you. here is the demo

$("#myUL li").each(function() {
    var partDesc = $(this).find('.partDesc').val();
    var itemDesc = $(this).find('.itemDesc').val();
    var itemImg = $(this).find('.itemImg').attr('src');
    alert('partDesc: '+partDesc);
    alert('itemDesc: '+itemDesc );
    alert('itemImg: '+itemImg );
});
like image 116
Zain Shaikh Avatar answered Dec 19 '25 16:12

Zain Shaikh



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!