CODEWITHSUNDEEP
javascriptjqueryhtml
Daniele Martini
Daniele Martini

Reputation: 143

jquery add HTML code to the page

I have a this HTML Code in a separate file and I have to add it to a another HTML page. 

<!-- TAGLIO DONNA MEDIO -->                                               
<div class="form-inline divNoMargin col-md-12 def_taglioDonnaMedio noPadding ">
    <!-- TITLE -->
    <label class="col-md-5 noPaddingLeft divNoMargin defTaglioDonnaMedioTitle testoPiccolo">Taglio Donna Medio</label>

    <!--OPRZIONI PREZZO -->                                    
    <!-- SELECT 1 -->
    <div class=" col-md-8 divNoMargin  select1">
        <label class="testoPiccolo pull-left">prezzo:</label>
        <label for="" id="" class="col-md-4 pull-right testoMedio text-right prezzo defPrezzoTagliodonnaMedio">,00</label>
    </div>        

    <!-- SELECT 2 -->
    <div class=" col-md-8 noMarginLeft2 hidden select2">
        <label class="pull-left testoPiccolo">prezzo a partire da:</label>
        <label for="" id="" class="pull-right col-md-4 testoMedio text-right prezzo noMarginLeft2 defPrezzoTagliodonnaMedio">,00</label>
    </div>         

</div>

I tried using this jquery but doesn't work. Anyone

var parentDiv2 = $(document).find('.nuoviServiziReview1');
$.get( "nuoviServiziReview.html", function( data ) {
    var nuovoServizioReview = $('<div/>',{id:'Servizio'+ incremento}).append(parentDiv2);
    nuovoServizioReview.html(data);
})

Upvotes: 0

Views: 209

Answers (3)

Shubham Khatri
Shubham Khatri

Reputation: 281626

append(content) appends content to the inside of every matched element. appendTo(selector) appends all of the matched elements to another specified set of elements.

Also

A.append(B) appends B to A
A.appendTo(B) appends A to B

So you need to use appendTo() instead of append() as:

var parentDiv2 = $(document).find('.nuoviServiziReview1');
$.get( "nuoviServiziReview.html", function( data ) {
    var nuovoServizioReview = $('<div/>',{id:'Servizio'+ incremento});
    nuovoServizioReview.html(data);
    nuovoServizioReview.appendTo(parentDiv2);
});

This should work :)

Upvotes: 0

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167162

It is because, you are not doing anything to the DOM:

var parentDiv2 = $(document).find('.nuoviServiziReview1');
$.get( "nuoviServiziReview.html", function( data ) {
    var nuovoServizioReview = $('<div/>',{id:'Servizio'+ incremento});
    nuovoServizioReview.html(data);
    nuovoServizioReview.appendTo(parentDiv2);
})

Upvotes: 1

Jordi Ruiz
Jordi Ruiz

Reputation: 487

Have you tried load?

http://api.jquery.com/load/

Description: Load data from the server and place the returned HTML into the matched element.

$('.nuoviServiziReview1').load('nuoviServiziReview.html');

Upvotes: 0

Related Questions