Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Dec 2011
    Posts
    41
    Thanks
    14
    Thanked 0 Times in 0 Posts

    delete HTML tag inside <h3>....</h3>?

    Assume I have a HTML code like:

    ....
    <h3 class="aaaa">.....<br>.....<br>....</h3>
    .....


    How can I (with JavaScript) delete all <br> tags inside ALL (!) <h3> elements but keep all other text stuff?

    Thank you
    Peter

  • #2
    Regular Coder
    Join Date
    Aug 2012
    Posts
    145
    Thanks
    0
    Thanked 27 Times in 27 Posts
    Hi pstein,

    See if this helps you with what you're looking for:

    Code:
    <!DOCTYPE html>
    <html>
    <body>
    <h1>Hi<br/>Eph</br>2:8-9</br></h1>
    
    <h2>Hi<br/>Eph</br>2:8-9</br></h2>
    
    <h3>Hi<br/>Eph</br>2:8-9</br></h3>
    
    <h3>Hi<br/>Eph</br>2:8-9</br></h3>
    
    <h4>Hi<br/>Eph</br>2:8-9</br></h4>
    
    
    <button onclick="removeH3()">Try it</button>
    
    <script>
    
    function removeH3(){
    var test = document.getElementsByTagName('h3');
    
    for(var i = 0;i<test.length;i++){
    var elements = test[i].getElementsByTagName('br');
    while (elements[0]){
    elements[0].parentNode.removeChild(elements[0])
    }
    }
    
    }
    </script>
    
    </body>
    </html>
    This should remove all the <br/> in a H3 tag only...
    1 Corinthians 15:3-4 / Ephesians 2:8-9 - What or Who are you living for? Jesus is returning very soon

  • #3
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,401
    Thanks
    11
    Thanked 595 Times in 575 Posts
    Modern methods make it a lot simpler:
    Code:
      [].map.call(document.querySelectorAll("h3 br"), 
        Function.call.bind(document.body.remove) )
    and jQuery makes the same solution style easier to type out each time:

    Code:
     $("h3 br").remove();
    and you can pull off the visual appearance of such an operation without js by using css:
    Code:
     h3 br{display:none}
    and you can use js to add the css to the document just-in-time:
    Code:
    document.body.appendChild(document.createElement("style")).innerHTML="h3 br {display:none}";
    Last edited by rnd me; 03-04-2014 at 08:19 PM.
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.6, IE11:9.1, IE9:3.1, IE10:3.0, FF:17.2, CH:46, SF:11.4, NON-MOUSE:38%

  • Users who have thanked rnd me for this post:

    pstein (03-07-2014)

  • #4
    New Coder
    Join Date
    Dec 2011
    Posts
    41
    Thanks
    14
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by rnd me View Post
    Code:
     $("h3 br").remove();
    works perfect :-)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •