Accessing The Text In An Element That Triggered The Event

I have an unordered list and I want to change the text on a button when a list item is clicked to the text in the list item. So far, I have: $(document).ready(function() {

Solution 1:

try:

$(document).ready(function() {  
    $('.List-item').on("click",function(){
        $('#selectedOption').text($(this).text());
    }); 
});

Because this will refer to what you click. Also, you can use

event.target.innerText

to get the clicked li text without jQuery

Solution 2:

.text will give you the text

$(document).ready(function() {  
    $('.List-item').on("click",function(){
        alert( $('option:selected', this).text());
        var txt =  $('option:selected', this).text();
    }); 
});

Solution 3:

Try This:

$(document).ready(function() {  
        $('.List-item').on("click",function(){
            $('#selectedOption').text($(this).text());
        }); 
    });

this refers to the object on which onclick is triggered.