Creating DIV elements and adding HTML Contents

Question

I have no knowledge in jquery. can some body guide me what the below code does. I googled it but no result found. I want to add some HTML Contents inside the div whose class is 'p-notification'. How to do this?

 this.notification = $('<div/>', {
            'class': 'p-notification'
 });
 this.content = $('<div/>', {
        'class': $elem.attr("hasFooter") === "true" ? 'p-content with-p-footer' : 'well',
        'style': $elem.attr("paddless") === "true" ? 'padding:0;' : '',     
        'text': 'Loading'
 });

Answer 1

The following part adds or sets the notification property on the scope to be a newly created div element with class p-notification :

 this.notification = $('<div/>', {
            'class': 'p-notification'
 });

The next part adds or sets the content property on the scope to be a newly created div element with several attributes being preset: class , style , and text :

 this.content = $('<div/>', {
        'class': $elem.attr("hasFooter") === "true" ? 'p-content with-p-footer' : 'well',
        'style': $elem.attr("paddless") === "true" ? 'padding:0;' : '',     
        'text': 'Loading'
 });

By itself this will have no net effect on the DOM, since you have created elements but not inserted them into the document. You can insert them by using one of several methods provided by jQuery, eg append :

$('#somediv').append(this.content);//adds the div that was created to an element with id somediv

Answer 2

You could do like this to add content:

$('.p-notification').append('<div>Hey</div>');

or this to replace content:

$('.p-notification').html('<div>Hey</div>');