CODEWITHSUNDEEP
javascripthtmlcss
Adam Davis
Adam Davis

Reputation: 93625

Hide HTML element by id

Hopefully there's a quick and dirty way to remove the "Ask Question" (or hide it) from a page where I can only add CSS and Javascript:

  <div class="nav" style="float: right;">
      <ul>
          <li style="margin-right: 0px;" >
              <a id="nav-ask" href="/questions/ask">Ask Question</a>
          </li>
      </ul>
  </div>

I can't hide the nav class because other page elements use it.

Can I hide the link element via the nav-ask id?

Upvotes: 37

Views: 181051

Answers (6)

pixeltocode
pixeltocode

Reputation: 5288

you can use CSS selectors

a[href="/questions/ask"] { display:none; }

Upvotes: 1

Rob Allen
Rob Allen

Reputation: 17749

@Adam Davis, the code you entered is actually a jQuery call. If you already have the library loaded, that works just fine, otherwise you will need to append the CSS 

<style type="text/css">
    #nav-ask{ display:none; }
</style>

or if you already have a "hideMe" CSS Class: 

<script type="text/javascript">

    if(document.getElementById && document.createTextNode)
    {
        if(document.getElementById('nav-ask'))
        {
            document.getElementById('nav-ask').className='hideMe';
        }
    }

</script>

Upvotes: 7

Fermin
Fermin

Reputation: 36111

If you want to do it via javascript rather than CSS you can use:

var link = document.getElementById('nav-ask');
link.style.display = 'none'; //or
link.style.visibility = 'hidden';

depending on what you want to do.

Upvotes: 141

jwhat
jwhat

Reputation: 2042

<style type="text/css">
  #nav-ask{ display:none; }
</style>

Upvotes: 20

Brant
Brant

Reputation: 6031

.nav ul li a#nav-ask{
    display:none;
}

Upvotes: 5

Adam Davis
Adam Davis

Reputation: 93625

I found that the following code, when inserted into the site's footer, worked well enough:

<script type="text/javascript">
$("#nav-ask").remove();
</script>

This may or may not require jquery. The site I'm editing has jquery, but unfortunately I'm no javascripter, so I only have a limited knowledge of what's going on here, and the requirements of this code snippet...

Upvotes: 3

Related Questions