JQuery Image OnClick Add Border

Question

I need some JQuery code so that I can add a CSS border to an image when I click on it.

<img src="myimage" onclick="AddBorder();" />

PriorityMark · Accepted Answer · 2011-12-30 18:42:53Z

17

If you're using jQuery, I'd recommend removing the inline onclick handler, as that's the less desirable way to bind to the event:

<img src="http://jsfiddle.net/img/logo.png" />

And then just setup a simple event binder:

$(function () {
  $("img").click(function() {
    $(this).css('border', "solid 2px red");  
  });
});

Here's a jsfiddle

answered Dec 30, 2011 at 18:42

PriorityMark

3,24719 silver badges22 bronze badges

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

Comments

Jason MacLean · Accepted Answer · 2011-12-30 18:38:53Z

1

In that onClick, instead of AddBorder();, place:

$(this).css("border","1px solid black");

answered Dec 30, 2011 at 18:38

Jason MacLean

5136 silver badges15 bronze badges

Matt H · Accepted Answer · 2011-12-30 18:39:41Z

-1

Er... what have you tried so far?

function AddBorder() { $(this).css('border','1px solid red'); }

answered Dec 30, 2011 at 18:39

Matt H

6,5502 gold badges32 silver badges34 bronze badges

Please don't mark -1 unless you also add a comment explaining why