Sliding Pop Up Button Open and Close

Sliding Pop Up Button Open and Close

Hello Everyone. I am looking for a way to make the following code have the button switch between one color to another.

Any suggestions would be great.

<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>slide demo</title>

<style>

body{
    margin:0;
}

.pollSlider{
    position:fixed;
    height:100%;
    background:red;
    width:200px;
    right:0px;
    margin-right: -200px;
}
#pollSlider-button{
    position:fixed;
    width:100px;
    height:50px;
    right:0px;
    background:green;
    top:300px;
}
</style>

<script src=" " target="_blank">http://code.jquery.com/jquery-1.10.1.min.js"></script>
<script src=" " target="_blank">http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>

</head>
<body>

<div class="pollSlider"></div>
<div id="pollSlider-button"></div>

<script type="text/javascript">
  1. $(document).ready(function () {
  2.     $('#pollSlider-button').click(function () {
  3.         if ($(this).css("margin-right") == "200px") {
  4.             $('.pollSlider').animate({
  5.                 "margin-right": '-=200'
  6.             });
  7.             $('#pollSlider-button').animate({
  8.                 "margin-right": '-=200'
  9.             });
  10.         } else {
  11.             $('.pollSlider').animate({
  12.                 "margin-right": '+=200'
  13.             });
  14.             $('#pollSlider-button').animate({
  15.                 "margin-right": '+=200'
  16.             });
  17.         }
  18.     }). click(); // this click call makes a fake click to start the page with an animated menu popping out.
  19. });

</script>

</body>
</html>