Trying to alter css of one div by clicking an outside link via jQuery click()

Question

I've tested out the CSS manually to where if I apply

display: none;

then it does what I want, so if I could use jQuery to make this happen by clicking a link on the page, then I'd be set.

I've never altered CSS via jQuery before, so I'm just going to try and explain what I'm trying to do here.

I have

<a id="one" href="#">click</a>

and then

<h3 id="two"><a href="#">link</a></h3>

I want to be able to click the first link and then set

display: none;

on that h3 labeled 'two.'

I appreciate the help guys. This is my first question here, and I usually like to just research the stuff on my own, but I think I'm just missing something fairly similar here and figured I should just ask someone.

Answer 1

Use jQuery's toggle() in it's simplest form. Click to show, click again to hide.

$('#one').click(function(){
    $('#two').toggle()
})

Check working example at http://jsfiddle.net/RjKe8/

Answer 2

$('#one').toggle(function() {

    $('#two').hide();

}, function() {

    $('#two').show();

});

Answer 3

$("#one").click(function() {
    $("#two").hide(); // not quite display:none
})