GreaseMonkey UserScript for Remove HTML Section of a website

Question

I installed "Greasemonkey" to remove part of HTML code for specific site.

i found "jQuery" code for removing

function removeByClass(className) {
   $("."+className).remove();
}

I tried to replace the "ClassName" with "news_ticker" but it did not worked out.

I do not have much information in java language

the HTML section code that I want to remove as below

<div class="news_ticker">

    <div class="title"><a title="Title";</a></div>
    <div class="ticker">
        <div class="wrapper">
            <div class="ticker_feeds">
            <span class="aa_icon">"headline"</span>
            <span class="aa_icon">"headline"</span>
            <span class="aa_icon">"headline"</span>
            <span class="aa_icon">"headline"</span>
            <span class="aa_icon">"headline"</span>
            </div>
        </div>
        <div class="controls"><a class="prev"  title=""></a><a class="pause"  title=""></a><a class="next"  title=""></a></div>
    </div>
</div>

<style>
.static_banner01 {
    clear: both;
    overflow: hidden;
    padding-bottom: 10px;
    position: relative;
}
.banners{
    overflow: hidden; 
    width: 190px; 
    float: right;
}
.m15{
margin-left:14px;
}
.m18{
margin-left:20px;
}
.m10{
margin-left:10px;
}
.w155,
.w155 a{
width:155px !important;
}

.banners a{
    width: 190px;
    height: 80px;
}
.banners.last{
    margin-left:0;
}
</style>

Answer 1

1st issue of removing headline has been solve by below code thanks to V P

$("div").remove(".news_ticker");

now the site play video automatically, so i need to remove the video from main page. below code is for video section:

<div class="wrapper">
    <div class="headline"><a title="test" href="test.html">test</a></div>                       
        <div class="img_teaser">
            <span class="LimelightEmbeddedPlayer">  
                <div id="*.mp4"></div>  
                <video id="html5video" dir="ltr" class="video-js vjs-default-skin" autoplay preload="auto" loop width="395" height="296" data-setup='{}'>
                <source src="*.mp4" type='video/mp4' />         
                <p class="vjs-no-js">To view this video please enable JavaScript and consider upgrading your web browser</p>
                </video> 
            </span>
            <p class="caption"><span class="source">test</span> test ... <a title="test" href="test.html">test</a></p>
        </div>  
    </div>

I tried below codes:

did not work

$("span").remove(".LimelightEmbeddedPlayer");

did not work

$("div").remove(".LimelightEmbeddedPlayer");

when there is no video the site insert image, but this line remove video and image together.

$("div").remove(".img_teaser");

after some test find the solution (just remove the videos)

$("div span").remove(".LimelightEmbeddedPlayer");

I hope this help others who search for similar "userscript" for "Greasemonkey"

Answer 2

Try

<script>   
 function removeByClass(news_ticker) {
       $(".news_ticker").remove();
    }
</script>

or simply

<script>
      $(".news_ticker").html('');
</script>

Read this fro more information

Answer 3

You need to include jQuery to your userscript if you want to be able to use it.

Try adding // @require http://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js to the metadata header block of your script.
See Wiki greasespot article about adding external libraries like jQuery.

Remember that you can use the console (Ctrl+Shift+K on Windows / Firefox for example) in order to see error messages which could help you to find what is wrong with your code.

Finally, know that you not necessarily have to use jQuery to such a simple manipulation. Javascript alone is more than enough:

function removeByClass(className) {
    var elements = document.getElementsByClassName(className);
    for (var i = 0; i < elements.length; i++) {
        elements[i].outerHTML = "";
    }
}