Html – jQuery – selectors on a html string

htmljqueryjquery-selectorsstring

I am going to get a element from a html-string with jQuery, but I always get an undefined in my console.
My String is:

<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>

and I want to get the td.test.

I've tested:

console.log($('.test', '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').innerHTML);
console.log($('.test', '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').html());
console.log($('.test', '<td class="test">asd</td><td class="second">fgh</td><td class="last">jkl</td>').first().innerHTML);

and some more, but nothing works :/

Does anyone know a solution for my problem?

Best Solution

First, use jQuery.parseHTML to parse the HTML into an array of elements; then you’ll be able to convert it to a jQuery collection and use filter to restrict the collection to elements matching a selector.

var html =
    '<td class="test">asd</td>' +
    '<td class="second">fgh</td>' +
    '<td class="last">jkl</td>';

var text = $($.parseHTML(html)).filter('.test').text();

console.log(text);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>