full HTML of object returned by jQuery selector

Question

given this html:

<li id="the_list_item"><img src="some_img"></li> 

and this selectior:

$("#the_list_item") 

I want to get the full html from the object return by the jQuery selector.

Using:

$("#the_list_item").html() 

...just gives me the inner html (the <img src="some_img"> part)

But since:

$("#the_list_item").attr("id") 

gives me 'the_list_item', this indicated that the whole list item is indeed included in the object returned.. so how do I get the full code from that object?

I want to get a String: <li id="the_list_item"><img src="some_img"></li> from my object, but can't find the way to do it.

Answer 1

I'm not sure if this works, but it might be worth a shot:

var html = $('#the_list_item')[0].outerHTML; alert(html); 

var html = $('#the_list_item')[0].outerHTML;  console.log(html);

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>  <ul>    <li id="the_list_item"><img src="some_img"></li>  </ul>