I am trying to change the text inside the spans using this piece of jquery but I am unable to. Why does this not work? What is the problem with this piece of code?
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">< /script>
<script>
$(document).ready(function(){
$("span").text("Changed");
});
});
</script>
</head>
<body>
<p>This is a <span>section</span>.</p>
<p>This is <span>another</span> paragraph.</p>
</body>
<html>
Keep eyes on console for errors .. In your code you got an error Uncaught SyntaxError: Unexpected token }",
$(document).ready(function(){
$("span").text("Changed");
});
}); //<<<<<<<<<<<<<< remove this line
Working demo
$(document).ready(function(){
$('span').text('Changed');
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>This is a <span>section</span>.</p>
<p>This is <span>another</span> paragraph.</p>It should work
$(document).ready(function(){
$("span").text("Changed");
});<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<p>This is a <span>section</span></p>
<p>This is <span>another</span> paragraph.</p>Just be more mindful:
1) Space before / in script tag is breaking your code
2) Html should be closed
3) }); is duplicated for some reason
And You can use shorter notation:
$(function() {})
instead of:
$(document).ready(function() { })
