Q:

jquery append css to head

I wanted to learn some jQuery and I tried to start with something simple (or that's what I thought anyway), I'm trying to change some div style with some css but it does not seem to work.
Any ideas regarding what I am doing wrong?

$('head').append('<style type="text/css"> #main1, #main2 { 
background-image: linear-gradient(to right, #92FE9D, #00C9FF) !important;
color: #000000 !important;
border-radius: 4; } 
</style>');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="main1">1</div>
<div id="main2">2</div>

A:

You need to concatenate new lines like:
$('head').append('<style type="text/css"> #main1, #main2 {'+
'background-image: linear-gradient(to right, #92FE9D, #00C9FF) !important;'+
'color: #000000 !important;'+
'border-radius: 4; }'+
'</style>'); 

