Zeca Novaes
Reputation: 419
Retrieve all content inside div, keep div tags
I have two div inside each .res_*. I need to retrieve all content inside the .res_* div, including the <div> tags.
<div class="res_componente_caminhao_abo_pneu">
<div class="div1">
<table class="noselect tbline">
<thead>
<tr>
<th>
<p class="minatit">ABO</p>
</th>
<th>
<p class="data">15/10/2017</p>
</th>
</tr>
</thead>
</table>
<table class="tbfilter noselect" id="filter_componente_caminhao_abo_tremforca">
<tbody>
<tr>
<td class="pointer transition shadbot">MP < 1K</td>
<td class="pointer transition shadbot">MP > 1K</td>
</tr>
</tbody>
</table>
</div>
<div class="div2">
<table id="status_componente_caminhao_abo_tremforca">
<tbody>
<tr>
<td class="status transition noselect shad">
<div class="tbpad"><img src="resources/img/comando.jpg">
<p class="pblock">Comando final LD</p>
</div>
<div class="mpst bgblack">5 alertas</div>
</td>
<td class="status transition noselect shad">
<div class="tbpad"><img src="resources/img/comando.jpg">
<p class="pblock">Comando final LE</p>
</div>
<div class="mpst bgblack">4 alertas</div>
</td>
<td class="status transition noselect shad">
<div class="tbpad"><img src="resources/img/transmissao.png">
<p class="pblock">Transmissao</p>
</div>
<div class="mpst bgblack">2 alertas</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="res_componente_caminhao_abo_tremforca">
<div class="div1">
<table class="noselect tbline">
<thead>
<tr>
<th>
<p class="minatit">ABO</p>
</th>
<th>
<p class="data">15/10/2017</p>
</th>
</tr>
</thead>
</table>
<table class="tbfilter noselect" id="filter_componente_caminhao_abo_tremforca">
<tbody>
<tr>
<td class="pointer transition shadbot">MP < 1K</td>
<td class="pointer transition shadbot">MP > 1K</td>
</tr>
</tbody>
</table>
</div>
<div class="div2">
<table id="status_componente_caminhao_abo_tremforca">
<tbody>
<tr>
<td class="status transition noselect shad">
<div class="tbpad"><img src="resources/img/comando.jpg">
<p class="pblock">Comando final LD</p>
</div>
<div class="mpst bgblack">5 alertas</div>
</td>
<td class="status transition noselect shad">
<div class="tbpad"><img src="resources/img/comando.jpg">
<p class="pblock">Comando final LE</p>
</div>
<div class="mpst bgblack">4 alertas</div>
</td>
<td class="status transition noselect shad">
<div class="tbpad"><img src="resources/img/transmissao.png">
<p class="pblock">Transmissao</p>
</div>
<div class="mpst bgblack">2 alertas</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="res_componente_caminhao_cpx_tremforca">
<div class="div1">
<table class="noselect tbline">
<thead>
<tr>
<th>
<p class="minatit">CPX</p>
</th>
<th>
<p class="data">15/10/2017</p>
</th>
</tr>
</thead>
</table>
<table class="tbfilter noselect" id="filter_componente_caminhao_abo_tremforca">
<tbody>
<tr>
<td class="pointer transition shadbot">MP < 1K</td>
<td class="pointer transition shadbot">MP > 1K</td>
</tr>
</tbody>
</table>
</div>
<div class="div2">
<table id="status_componente_caminhao_abo_tremforca">
<tbody>
<tr>
<td class="status transition noselect shad">
<div class="tbpad"><img src="resources/img/comando.jpg">
<p class="pblock">Comando final LD</p>
</div>
<div class="mpst bgblack">5 alertas</div>
</td>
<td class="status transition noselect shad">
<div class="tbpad"><img src="resources/img/comando.jpg">
<p class="pblock">Comando final LE</p>
</div>
<div class="mpst bgblack">4 alertas</div>
</td>
<td class="status transition noselect shad">
<div class="tbpad"><img src="resources/img/transmissao.png">
<p class="pblock">Transmissao</p>
</div>
<div class="mpst bgblack">2 alertas</div>
</td>
</tr>
</tbody>
</table>
</div>
</div>
JS
var result = [CPX, ABO];
$.each(result, function(i, v) {
$("#whitebginternal").append("<div id='" + v + "'></div>");
var test = $("#whitebginternal").find('[class*="res_"] table th p.minatit:contains("' + v + '")').closest('div').html();
console.log(test)
});
}
My function returns only the first table for each result [CPX, ABO], and all <div> tags seem to disappear. Anyone here who knows where am I going wrong?
Upvotes: 0
Views: 31
Answers (1)
SilverSurfer
Reputation: 4368
Use get() to access to the DOM nodes underlying each jQuery object
console.log($( "div" ).get())<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="res_componente_caminhao_abo_pneu">
<div class="div1"> <table class="noselect tbline"> <thead> <tr><th><p class="minatit">ABO</p></th><th><p class="data">15/10/2017</p></th> </tr></thead></table><table class="tbfilter noselect" id="filter_componente_caminhao_abo_tremforca"><tbody><tr><td class="pointer transition shadbot">MP < 1K</td><td class="pointer transition shadbot">MP > 1K</td></tr> </tbody></table></div>
<div class="div2"> <table id="status_componente_caminhao_abo_tremforca"><tbody><tr><td class="status transition noselect shad"> <div class="tbpad"><img src="resources/img/comando.jpg"><p class="pblock">Comando final LD</p></div><div class="mpst bgblack">5 alertas</div></td><td class="status transition noselect shad"> <div class="tbpad"><img src="resources/img/comando.jpg"><p class="pblock">Comando final LE</p></div><div class="mpst bgblack">4 alertas</div></td><td class="status transition noselect shad"> <div class="tbpad"><img src="resources/img/transmissao.png"><p class="pblock">Transmissao</p></div><div class="mpst bgblack">2 alertas</div></td></tr></tbody></table></div>
</div>
<div class="res_componente_caminhao_abo_tremforca">
<div class="div1"> <table class="noselect tbline"> <thead> <tr><th><p class="minatit">ABO</p></th><th><p class="data">15/10/2017</p></th> </tr></thead></table><table class="tbfilter noselect" id="filter_componente_caminhao_abo_tremforca"><tbody><tr><td class="pointer transition shadbot">MP < 1K</td><td class="pointer transition shadbot">MP > 1K</td></tr> </tbody></table></div>
<div class="div2"> <table id="status_componente_caminhao_abo_tremforca"><tbody><tr><td class="status transition noselect shad"> <div class="tbpad"><img src="resources/img/comando.jpg"><p class="pblock">Comando final LD</p></div><div class="mpst bgblack">5 alertas</div></td><td class="status transition noselect shad"> <div class="tbpad"><img src="resources/img/comando.jpg"><p class="pblock">Comando final LE</p></div><div class="mpst bgblack">4 alertas</div></td><td class="status transition noselect shad"> <div class="tbpad"><img src="resources/img/transmissao.png"><p class="pblock">Transmissao</p></div><div class="mpst bgblack">2 alertas</div></td></tr></tbody></table></div>
</div>
<div class="res_componente_caminhao_cpx_tremforca">
<div class="div1"> <table class="noselect tbline"> <thead> <tr><th><p class="minatit">CPX</p></th><th><p class="data">15/10/2017</p></th> </tr></thead></table><table class="tbfilter noselect" id="filter_componente_caminhao_abo_tremforca"><tbody><tr><td class="pointer transition shadbot">MP < 1K</td><td class="pointer transition shadbot">MP > 1K</td></tr> </tbody></table></div>
<div class="div2"> <table id="status_componente_caminhao_abo_tremforca"><tbody><tr><td class="status transition noselect shad"> <div class="tbpad"><img src="resources/img/comando.jpg"><p class="pblock">Comando final LD</p></div><div class="mpst bgblack">5 alertas</div></td><td class="status transition noselect shad"> <div class="tbpad"><img src="resources/img/comando.jpg"><p class="pblock">Comando final LE</p></div><div class="mpst bgblack">4 alertas</div></td><td class="status transition noselect shad"> <div class="tbpad"><img src="resources/img/transmissao.png"><p class="pblock">Transmissao</p></div><div class="mpst bgblack">2 alertas</div></td></tr></tbody></table></div>
</div>Upvotes: 1
Related Questions
- How can I get the entire contents inside of a DIV with jquery?
- using jquery to get all html in div
- How to get the Html content of multiple div
- Get content of <div> using JQuery
- Get all the div with a special content
- how to get div content by jquery?
- Getting content of a div includes the div itself in jquery
- Jquery to get the contents of a div
- get entire contents of a div
- how to get the contents inside a div along with all html tags along with values present in text box etc tags