Search code examples
javascriptgreasemonkey

JavaScript: GreaseMonkey, How to insert an element


I am using greasemonkey to change a website his content.

I want to add an LI element with JavaScript after de LI item of Dogs, it is not my website so I am not allowed to insert some ID's into the LI items.

<div id="main-nav">
    <ul class="nav navbar-nav brand-left">
        <li><a href="/cars">Cars</a></li>
        <li><a href="/bikes">Bike</a></li>
    </ul>
    <ul class="nav navbar-nav brand-right">
        <li><a href="/cats">Cats</a></li>
        <li><a href="/dogs">Dogs</a></li>
        NEW LI ELEMENT HERE
    </ul>
</div>

Solution

  • var ul = document.querySelector('.nav.navbar-nav.brand-right');
    var newli = document.createElement('li');
    // do what you need to the new li, including giving it an id if you want
    ul.appendChild(newli);
    

    That should do it