Question

I am trying to set a style for paragraph which is fetched via JS.

Here is what I have:

  var info = "<p>" + meeting.summary + "</p>;

I want to apply some styling and I am trying the code below:

var info= "<p style="font-family: Arial, sans-serif; font-size: small;">" + meeting.summary + "</p>;

But that doesn’t work and the JS code does not work correctly. How I can use CSS for JavaScript variables such as the one I am trying?

Answer 1

To work with what you’ve got right now use this (notice the use of '):

var info= '<p style="font-family: Arial, sans-serif; font-size: small;">' + meeting.summary + '</p>';

But I would simply suggest to add a class to the p and style that in CSS:

// JS
var info = '<p class="info">' + meeting.summary + '</p>';

// CSS
.info {font-family: Arial, sans-serif; font-size: small;}