jquery iterating over list element with on click event

Question

I have a list that I want to attach a click onto for each li although i'm failing to get this working, example below. please help!? Thanks,

 <ul>
   <li>a</li>
   <li>b</li>
   <li>c</li>
   <li>d</li>
 </ul>


 $('li').each(function () {
     $(this).click(function (e) {
        // access the letter - not sure how to do this (?)
     });
  });

While not the ideal syntax, your code works: jsfiddle.net/j08691/UA72c — j08691
– j08691, Commented Jun 27, 2013 at 18:02

PSL · Accepted Answer · 2013-06-27 18:09:29Z

1

Just do:

$(function(){
     $('li').click(function (e) {
        alert(this.innerHTML);  // not sure how to access this (?)
     });
});

You don't need to use each iteration on li. All you need is a selector while registering the click event and then access either with plain element propert this.innerHTML or jquery methods $(this).text() or $(this).html()

Demo

edited Jun 27, 2013 at 18:09

answered Jun 27, 2013 at 18:01

PSL

124k21 gold badges257 silver badges243 bronze badges

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

6 Comments

James Radford Over a year ago

for some reason the alert pops up multiple times?

PSL Over a year ago

@Aiias this is not jquery object $(this) is.

Brad M Over a year ago

@Aiias this by default is not a jQuery object

PSL Over a year ago

@JamesRadford added a fiddle. See if that help you.

j08691 Over a year ago

@JamesRadford - is your code wrapped in a document ready call?

|

chetan singhal · Accepted Answer · 2013-06-27 18:04:00Z

0

$('li').click(function (e) {
    $(this).text(); 
 });

answered Jun 27, 2013 at 18:04

chetan singhal

9481 gold badge13 silver badges36 bronze badges

Collectives™ on Stack Overflow

jquery iterating over list element with on click event

2 Answers 2

6 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related