How to get a specific item using jquery?

Question

I am trying to get an element divthat has a class repeat. So I tried it, but it shows undefined.

var data = '<div class="test form-group col-xs-6 repeat" id="repeat_py">\n <div class="kv col-lg-2">index:\n<pre class="num">0</pre></div>\n<div><span class="kv">value: <pre class="num">m</pre></span></div></div>'

alert($(data).find('div.repeat').html())

Fiddle

Answer 1

You need .filter()instead.find()

Reduce the set of matched elements to those that match the selector or pass a function test.

 $(data).filter('div.repeat').html()

var data = '<div class="test form-group col-xs-6 repeat" id="repeat_py">\n <div class="kv col-lg-2">index:\n<pre class="num">0</pre></div>\n<div><span class="kv">value: <pre class="num">m</pre></span></div></div>'

alert($(data).filter('div.repeat').html())

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Run codeHide result

Answer 2

replace findwithfilter

alert($(data).filter('div.repeat').html())

search searches for children, the filter looks at the level of kinship

Answer 3

var data = '<div class="test form-group col-xs-6 repeat" id="repeat_py">\n <div class="kv col-lg-2">index:\n<pre class="num">0</pre></div>\n<div><span class="kv">value: <pre class="num">m</pre></span></div></div>';
 
var HTMLobject = $('<div/>').html(data);
console.log(HTMLobject.find('div.repeat').html());
alert(HTMLobject.find('div.repeat').html());

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Hide result

Answer 4

alert($(data).html());

Answer 5

-, undefined

	var data = '<div><div class="test form-group col-xs-6 repeat" id="repeat_py">\n <div class="kv col-lg-2">index:\n<pre class="num">0</pre></div>\n<div><span class="kv">value: <pre class="num">m</pre></span></div></div></div>'
alert($(data).find('div.repeat').html())

Hide result

.

Answer 6

ALternate solution:

var data = '<div class="test form-group col-xs-6 repeat" id="repeat_py">\n <div class="kv col-lg-2">index:\n<pre class="num">0</pre></div>\n<div><span class="kv">value: <pre class="num">m</pre></span></div></div>'
$('body').append(data);
alert($('body').find('div.repeat').html());

Fiddle link

https://jsfiddle.net/fgf9nyn0/18/