How to use JavaScript in Google chrome Console?

In this tutorial we will write simple JavaScript on Google chrome console to get all the elements text inside ul li tags from below HTML code.

HTML Code:

<ul class="multiselect-container dropdown-menu">
    <li class="multiselect-item multiselect-all">
        <a tabindex="0" class="multiselect-all">
            <label class="checkbox">
                <input type="checkbox" value="multiselect-all"
                       class="regular-checkbox"> Select all</label>
        </a>
    </li>
    <li class="">
        <a tabindex="0"><label class="checkbox">
            <input type="checkbox" value="CANCELLED"
                   class="regular-checkbox"> Cancelled</label>
        </a>
    </li>
    <li class="">
        <a tabindex="0"><label class="checkbox">
            <input type="checkbox" value="CONFIRMED" 
                   class="regular-checkbox"> Confirmed</label></a></li>
    <li class="">
        <a tabindex="0"><label class="checkbox">
            <input type="checkbox" value="REJECTED" 
                   class="regular-checkbox"> Rejected</label>
        </a>
    </li>
</ul>

 

SOLUTION:

 [
    ...new Set(
        $x("//ul[@class='multiselect-container dropdown-menu']//a/label")
            .map(value=> (
                value.textContent
             )

         )

    )

]

ANSWER:

(4) [' Select all', ' Cancelled', ' Confirmed', ' Rejected']