# JQuery Element ausgeben



## foobar (27. März 2010)

Hallo,

wie bekomme ich mit dem gegebenen html Markup das gesamte erste box element bei jedem klick ausgegeben?
Also das hier ? <div class="box"><a href="#" onClick="return onClicked(this);">foo</a></div>


```
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">


$(document).ready(function(){
	
});


function onClicked(target){
	var node = $('.box:first').html();
	alert(node);
}
//Wie kriegt man nur das gesamte erste element raus - <div class="box"><a href="#" onClick="return onClicked(this);">foo</a></div>
</script>
</head>
<body>
<div class="box"><a href="#" onClick="return onClicked(this);">foo</a></div>
<div class="box"><a href="#" onClick="return onClicked(this);">bar</a></div>
<div class="box"><a href="#" onClick="return onClicked(this);">foobar</a></div>
</body>
</html>
```


----------



## Matthias Reitinger (27. März 2010)

Hallo,

probier es mal so:

```
function onClicked(target){
	var node = $('.box:first');
	var html = $('<div>').append(node.clone()).html();
	alert(html);
}
```

Grüße,
Matthias


----------



## foobar (28. März 2010)

Hallo,

danke damit hat es nun geklappt. 
Ich verstehe das Skipt aber nicht ganz, append fügt doch nur die node, also alles was in <a>  ist hinter ein div, wieso kommt denn dabei dann 
<div class="box"><a href="#" onClick="return onClicked(this);">foo</a></div> 
heraus?


----------



## Matthias Reitinger (28. März 2010)

Hallo,

in node ist ein Verweis auf das erste <div class="box"> gespeichert. Dieses wird geklont und in ein neues <div> verpackt, von dem anschließend der HTML-Inhalt ausgegeben wird. Klarer geworden?

Grüße,
Matthias


----------

