Jquery return element html instead of content

Question

I have something like this

<ul>
<li class="aclass" id="a">content</li>
<li class="aclass" id="b">content</li>
<li class="aclass" id="c">content</li>
<li class="aclass" id="d">content</li>
<li class="aclass" id="e">content</li>
<li class="aclass" id="f">content</li>
</ul>

I have code like

$(".aclass").live("mousedown",function() {

alert($this.html());

});

This will alert the content, what I would like to do is alert the entire element like

<li class="aclass" id="f">content</li>

I've tried $(this).parent() but that returns the whole UL

exact duplicate of jQuery - Get selected element's outer HTML — redsquare
– redsquare, Commented Dec 23, 2010 at 8:49

Darin Dimitrov · Accepted Answer · 2010-12-23 08:50:30Z

6

alert($(this).clone().wrap('<div/>').parent().html());

answered Dec 23, 2010 at 8:50

Darin Dimitrov

1.0m275 gold badges3.3k silver badges3k bronze badges

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

2 Comments

redsquare Over a year ago

but...you will end up with invalid markup. Should clone the element first

Darin Dimitrov Over a year ago

@redsquare, very good point. I've updated my answer to take your suggestion into account.

keegan3d · Accepted Answer · 2010-12-23 08:59:55Z

0

alert($('<div/>').append($(this).clone()).html());

http://jsfiddle.net/keegan3d/nfEyQ/

answered Dec 23, 2010 at 8:59

keegan3d

11.4k10 gold badges57 silver badges78 bronze badges

Comments

kioopi · Accepted Answer · 2010-12-23 09:07:49Z

0

To get the html-code of a DOM-Node you can use the property outerHTML

var html = document.getElementById('someId').outerHTML;

this sadly doesnt work in firefox. But you can use XMLSerializer to achieve the same result. Like this

var elm = document.getElementById('someId');
var xmls = new XMLSerializer();
var html = xmls.serializeToString(elm);

in your jQuery-code this might look something like this:

$(".aclass").live("mousedown",function() {
  alert( this.outerHTML || new XMLSerializer().serializeToString(this)  );
});

answered Dec 23, 2010 at 9:07

kioopi

2,2902 gold badges20 silver badges26 bronze badges

1 Comment

kioopi Over a year ago

Seems like XMLSerializer returns proper XML, this might give unexpected results, see: stackoverflow.com/questions/1700870/…

Collectives™ on Stack Overflow

Jquery return element html instead of content

3 Answers 3

2 Comments

Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related