<div class="test"> Div Text lorem ipsum <br> lorem ipsum <p class="some_class">Paragraph Content <br> tag and again child nested in it <span> span content</span></p></div>.
I want to get html of div element. Here is tricky part, If i use .html() this will also include children tags which is <p class="some_class">....<span>...</span>...</p> I only need br tag. How can I achieve that.
final output should look like:
Div Text lorem ipsum <br> lorem ipsum Paragraph content <br> tag and again child nested in it span content
If you want only text present inside any element, you can use innerText but you mentioned you required <br> tag in a result. So you can use innerText first, then replace line feed (\n) with <br> tag.
var divtext = document.getElementsByClassName('test')[0].innerText;
console.log(divtext);
console.log(divtext.replaceAll('\n', '<br>'));<div class="test"> Div Text lorem ipsum <br> lorem ipsum <p class="some_class">Paragraph Content <br> tag and again child nested in it <span> span content</span></p></div>You can use a JavaScript (while/for) loop.
Here's a live example.
<!DOCTYPE html>
<html lang="en">
<head>
<title>Get Children Content with br tag</title>
</head>
<body>
<div id="test"> Div Text lorem ipsum <br> lorem ipsum <p class="some_class">Paragraph Content <br> tag and again child nested in it <span> span content</span></p></div>.
</body>
<script>
// get all the content of the div tag
let test = document.getElementById("test");
let testData = test.innerHTML;
let finalText = "";
// this variable will decide to capture the lettes when captured in loop.
let capture = true;
// starting to over all the cahracter in the text content
for (let i = 0; i < testData.length; i++) {
let recursive = false;
if (
testData.charAt(i) == "<" &&
testData.charAt(i + 1) == "b" &&
testData.charAt(i + 2) == "r"
) {
// if <br> tag is receved skip 4 char and increment the i value
capture = true;
recursive = true;
} else if (testData.charAt(i) == "<") {
// if < is found stop capturing
capture = false;
} else if (testData.charAt(i) == ">") {
// if > is found start capturing but skip this iteration
capture = true;
}
// main capturing code
if (capture) {
if (testData.charAt(i) != ">") {
finalText = finalText + testData.charAt(i);
}
if (recursive) {
finalText =
finalText +
testData.charAt(i + 1) +
testData.charAt(i + 2) +
testData.charAt(i + 3);
i = i + 3;
}
}
}
console.log(finalText);
</script>
</html>