Question

I’m not sure if I can accomplish this with good old HTML, or if I need to use jquery. I have a bunch of images I need to display, and a user will click on one to “highlight” it, and then will be able to click on a button to continue modifying it or deleting that specific image. So far, this is what I have:

(function($){ 
  $(".inv_list li").click(function() {
     $(this).toggleClass("hilite");
  });
 })(jQuery); 


<ul class="inv_list">
   <li id="1"><img src=".."></li>
   <li id="2"><img src=".."></li>
</ul>
 <a href="#" class="buttonmod">Modify</a>
 <a href="#" class="buttondel">Delete</a>

At this point, I can toggle the highlight, but I’m pretty much lost after that.

Answer 1

Try attaching the handler to the IMG element no LI. LI element may not wrap your image I guess.

From this:

  $(".inv_list li").click(function() {

To this:

  $(".inv_list li").click(function() {

Or style your LI to be with CSS display:block;

And also check out your style. Maybe you do not have a correct “hilite” class.