Delete an entire class and everything in it from an HTML loaded via ajax

Asked

Viewed 19 times

0

I have two pages in HTML:

index.html:

    <div class="topo">
       topo
    </div>
    <div id="viewdata">
       <div class="conteudo">
          Essa é a home
       </div>
    </div>

html news.

    <div class="topo">
       topo
    </div>
    <div id="viewdata">
       <div class="conteudo">
          Essa é a notícia
       </div>
    </div>

I’m making the exchanges between the pages with AJAX. that way:

$.ajax({
    type: "GET",
    url: "noticia.html",
    dataType: "html"
}).done(function(data) {
    $('#viewdata').html(data);
});

But I wanted to just take everything that’s in the 'content' class in the noticia.html file, and not everything else, because the way I’m doing the result is being this:

    <div class="topo">
       topo
    </div>
    <div id="viewdata">
       <div class="topo">
          topo
       </div>
       <div id="viewdata">
          <div class="conteudo">
             Essa é a notícia
          </div>
       </div>
    </div>

That is, the generated file gets some duplicated classes. I could even delete the top with replace, but in practice the top class is giant, just like other classes, would be unviable. Is there any solution?

  • Do you want to take the div . content or just what’s inside? You want to insert in the div #viewdata or in the class . content?

  • @Sam I want to take the content class of the news.html and insert it into the viewdata of index.html, that is, delete the content of index.html and get a new content class of the news.html

1 answer

2


Use the method .load() where you can search in the requested file for a specific element:

$("#viewdata").load("noticia.html .conteudo");

The above code will replace all internal div HTML #viewdate by div .conteudo from the page noticia.html.

Browser other questions tagged

You are not signed in. Login or sign up in order to post.