From your makup, doing
$(document).on("click", "img", function() {
$("span").text("Click I agree")
});
which is the same as
$("img").onClick(funtion() {
$("span").text("Click I agree")
})
would work
But it would change the text on all spans when an image is clicked on a webpage.
To select the exact span with a specific image, you could specify an ID to the
<a>
link like so,
<li>
<a class="" id="home" ><img src="homelogo.jpg" style=" cursor:pointer; width:40px; height:40px;" /></a>
<span>Home</span>
</li>
Then you could do
$(document).on("click", "#home img", function() {
$("#home").next().text("Click I agree")
});
It gets easier if the span also has its own ID, you could just select that specific ID and change the text.
Read
JQuery API selectors[
^]
JQuery Events[
^]
JQuery .next()[
^]