How to put html code inside append of jQuery or JavaScript?

Question

How to put html inside append of jquery and append Div in webpage

              $('.oo').append(
               <div style="width:100%; min-height:35px; max-height:auto; margin-top:10px;">
               <div style="height:auto; margin:2px 2px 2px 16px;">
              <img src="image/xprin_load2_loader.gif" style="float:left; height:35px; width:35px; border-radius:5%;"/>
                 </div>
                 <div style="height:auto; margin: 5px 5px 5px 55px;  text-align:left; box-shadow: 3px 0px 0px #4080ff;">
                <b>: </b>
                <span style="margin:2px 2px;"></span>
               </div>
               </div>
             ); 

Answer 1

Do it like this,

$('.oo').append(
'<div style="width:100%; min-height:35px; max-height:auto'
 +'; margin-top:10px;">
               <div style="height:auto; margin:2p'
 +'x 2px 2px 16px;">
              <img src="image/xprin_load2_loader.gif'
 +'" style="float:left; height:35px; width:35px; border-radius:5%;"/>
   '
 +'              </div>
                 <div style="height:auto; margin:'
 +' 5px 5px 5px 55px;  text-align:left; box-shadow: 3px 0px 0px #4080ff;"'
 +'>
                <b>: </b>
                <span style="margin:2px 2p'
 +'x;"></span>
               </div>
               </div>');

It will work.

Answer 2

You just add quotes around the html you want to append

  $('.oo').append(
    ' <div style="width:100%; min-height:35px; max-height:auto; margin-top:10px;">' +
    +' <div style="height:auto; margin:2px 2px 2px 16px;">' + ' <img src="image/xprin_load2_loader.gif" style="float:left; height:35px; width:35px; border-radius:5%;"/>' + '</div>' + '<div style="height:auto; margin: 5px 5px 5px 55px;  text-align:left; box-shadow: 3px 0px 0px #4080ff;">' + '<b>: </b>' + '<span style="margin:2px 2px;"></span>' + '</div>' + '</div>'
  );