Why is it that placing jQuery code inside the body or head does not work normally?

Question

<script src="https://code.jquery.com/jquery-3.1.1.js">

</script> //inside head

$(function() {
$("a").attr("style", "color:green;");
}); //on JS page works, but....

<script src="https://code.jquery.com/jquery-3.1.1.js">
$(function() {
$("p").attr("style", "color:green;");
});
</script>. // together inside head or in body does not work....

However, this will work without jQuery, using only JS normally.

Answer 1

yeah, I tried that, too.
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'>$(function() {
$("a").attr("style", "color:green;");
});
</script>

inside the head element does not work, either. Even though the Ajax does work if I place the jQuery inside of Sololearns JS tab.

Answer 2

Martin Taylor that's what the issue was thx.
I didn't realize that you had to use two separate script tags.

Answer 3

Just insert
<script src='https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js'></script>
in the head tag