I'm trying to create a code in Javascript without the use of jQuery to find and output out the contents of California condor, which should print Critically Endangered in the console. However, I'm not sure how to do this correctly, especially without the use of jQuery. Can anyone help or give me some tips?
document.body.innerHTML =
`<div>
<ul data-continent="North America">
<li data-species="California condor">Critically Endangered</li>
<li data-species="American bison">Near Threatened</li>
</ul>
<ul data-continent="Europe">
<li data-species="Cave bear">Extinct</li>
</ul>
</div>`;
function code() {
return document.body.innerHTML.getElementsByTagName('ul data-continent="North America"').getElementsByTagName('li data-species="California condor"');
console.log(code())
<script>
document.body.innerHTML =
`<div>
<ul data-continent="North America">
<li data-species="California condor">Critically Endangered</li>
<li data-species="American bison">Near Threatened</li>
</ul>
<ul data-continent="Europe">
<li data-species="Cave bear">Extinct</li>
</ul>
</div>`;
function code() {
return document.querySelector('li[data-species="California condor"]').innerHTML
}
console.log(code())
</script>