How to add HTML using jQuery

Question

I am creating an HTML element using

$(this).html(' my html here'); 

There are many elements that I need to add here with different CSS. So I want to make append another HTML here

 $(this).html(' my html here'); $(this).html.append(' another html here'); 

How can i achieve this?

Answer 1

Announce first.

 var html = ""; html += "<span class="spnBlack"> First Content </span>"; html += "<p class="pRed">Second Content</p>"; $(this).html(html); 

And in the css file define

 .spnBlack { background-color: black; } .pRed { background-color: red; } 

Please avoid inline css.

Answer 2

You can create an html element as follows:

 var p = $('<p>').html('Hello world'); 

This does not yet “exist” on your page, you need to add it to your selector using both append and appendTo (depending on the “point of view”):

 $(this).append(p); 

or

 p.appendTo($(this));