Combining Jquery statements
<p>I wondered if anyone can help  me!</p>

<p>I have two separate jQuery statements on my site which basically act on a div that when clicked, will expand a content zone that is hidden by a negative margin on the right of the screen.</p>

<p>What I want to do is have several of these elements on each page, but I want something as streamlined as possible where I don't have to keep adding a whole new statement per element!</p>

<p>Here is a link to the website in question (the elements are on the right - one with a Plus sign, the other below with a Twitter icon)</p>

<p><a href="http://www.sandbanksproperty.co.uk/" rel="nofollow">Sandbanks Property</a></p>

<p>Below is the code I have:</p>

<p>//Setting up the functions:</p>

<pre><code>function extraOn() {
var w = $('.homeplus-expanded').width();
$('.homeplus-expanded').animate ({
    right : '0',
    'margin-right':'0px'
    }, 'fast');
}


function extraOff() {
var ws = $('.homeplus-expanded').innerWidth();
$('.homeplus-expanded').animate({
    right : '0',
    'margin-right':-ws
    },'fast'); 
}



function shareOn() {
var w = $('.homeplus-expanded').width();
$('.shareplus-expanded').animate ({
    right : '0',
    'margin-right':'0px'
    }, 'fast');
}


function shareOff() {
var sp = $('.shareplus-expanded').innerWidth();
$('.shareplus-expanded').animate({
    right : '0',
    'margin-right':-sp
    },'fast'); 
}
</code></pre>

<p>//and then calling these functions onClick:</p>

<pre><code>$('.homeplus').click(function(){
extraOn();
});


$('.homeplus-expanded span.close').click(function(){
extraOff();
    });

$('.shareplus').click(function(){
shareOn();
});


$('.shareplus-expanded span.close').click(function(){
shareOff();
    });
</code></pre>

<p>As you can see, I'm sure there is some cross over and some room for making the code a lot neater and more modular....</p>

<p>Thanks for any help you can provide...</p>
