How to remove script tag from html using javascript

Question

I am trying to remove script tag from Html Code using JavaScript. Here is the HTML Code :

<script type='text/x-template-handlebars' id='carousel_ui_buttons_next-nav_next'>
<button class="next nav" asg-button>{{{button_text}}}</button>
</script>

I want to remove script tag so the remaining part would be html only. I mean code should be changed inside browser.

When do you need the script tag to be removed? When the document loads? When a button is clicked? Please explain in more detail :) — www139, Oct 11 '15 at 23:21
@CodyMan What HTML, the rest of the HTML you haven't posted or the HTML inside of the — Manno, Oct 11 '15 at 23:24
The content of the script element is invalid script. Voting to close as unclear what the OP is asking. Also, there are many similar questions that the OP could leverage. — RobG, Oct 11 '15 at 23:30

ctf0 · Answer 1 · 2015-10-11T23:23:06.397

2

it would be better if you provided us with the code you currently have to help you understand what happened rather than using the code copy/paste ,anyway to fire the js code you first decide when you want it to kick in

when the page finish loading ?

$(window).load(function() {
    $('#carousel_ui_buttons_next-nav_next').remove();
});

or when the page is ready

$(document).ready(function($) {
    $('#carousel_ui_buttons_next-nav_next').remove();
});

or if you prefer you can make it as a function and call it as much as you want instead of repeating the same code over and over everywhere

function hideScript() {
    $('#carousel_ui_buttons_next-nav_next').remove();
});
// then use it like //
$(document).ready(function($) {
    hideScript();
});

the above code use JQuery which is much easier than vanilla js to understand and to work with.

edited Oct 11 '15 at 23:23

answered Oct 11 '15 at 23:17

ctf0

6,991
5
37
46

This is only the case if the OP wants to remove the entire block. I believe they may be asking for the HTML inside of the ` – Manno Oct 11 '15 at 23:22
I just wanna remove – CodyMan Oct 11 '15 at 23:24
@CodyMan so you mean when you click the button the script tag should be removed ? – ctf0 Oct 11 '15 at 23:24
Nope! I mean when the site loads the script tag should be removed but the content inside that should stay there. – CodyMan Oct 11 '15 at 23:28
All because, I am unable to perform click function inside that script tag. – CodyMan Oct 11 '15 at 23:30
1

@CodyMan actually putting the btn inside the script tag is wrong from the beginning, you should try a different approach. – ctf0 Oct 11 '15 at 23:33
Yeah! I know but that's not my code, That's why i am stuck up. I just require to remove that script tag so i will be able to click on that button. – CodyMan Oct 11 '15 at 23:36
it will never work as its invalid as @RobG said, but anyway as an answer to ur question check this http://stackoverflow.com/questions/9193212/difference-between-jquery-parent-and-closest-functions – ctf0 Oct 11 '15 at 23:38
Let us [continue this discussion in chat](http://chat.stackoverflow.com/rooms/91988/discussion-between-codyman-and-ctf0). – CodyMan Oct 11 '15 at 23:40

score 1 · Accepted Answer · answered Oct 11 '15 at 23:44

The content of your <script> tag is invalid Javascript, but here is one possible way of achieving what you are after:

// Function to convert an HTML string to a DOM element
String.prototype.toDOM = function () {
    var d = document,
        i,
        a = d.createElement('div'),
        b = d.createDocumentFragment();
    a.innerHTML = this;
    while (i = a.firstChild) {
        b.appendChild(i);
    }
    return b;
};

// The <script> we wish to replace
var st = document.getElementById('carousel_ui_buttons_next-nav_next');

// Replace it with the <button> that is inside of it
st.parentNode.replaceChild(st.innerHTML.trim().toDOM(), st);

Thanks a bunch for great answer. – CodyMan Oct 11 '15 at 23:47 — CodyMan, Oct 11 '15 at 23:47

How to remove script tag from html using javascript

2 Answers2