Alter the display property using jQuery

Alter the display property using jQuery

I am having two divs like:
<div class="toggle">Toggle</div><div class="data">Something</div>
Css should be:
.toggle {
padding: 10px;
border: 1px solid #999;
}
.data {
display: none;
padding: 5px;
}
I have been using jQuery to toggle the hide show property. But I want to
ask how to add the CSS property display: none; to this div and also remove
the CSS property from it when again the click is made. I know how to do
that: using if else. But I am not sure how to add or remove the css
attributes.
All much that I know about jQuery is something like:
$(".toggle").click(function() {
$(".data").show();
}) Any guide for the CSS jQuery?