Animating a div with 2 buttons

Question

There is a div and 2 buttons in my page. The button 1 is to fade in and fade out the div. First click, the div fades in, second click, the div fades out. And button 2 is to fade out the div ONLY. The script for button 1 works perfectly, but after I added the script for button 2, there is a problem with the div. After I clicked on the button 2 and the div faded out, and if I click on button 1 again, I have to click it twice to fade in the div again. How to solve it?
<script>
$(function() {
var expanded = false;
$('#needhelp').click(function(){
if (!expanded) {
$('#guidepopup').animate({'top' : '141px'}, {duration : 500});
expanded = true;
else {
$('#guidepopup').animate({'top' : '-190px'}, {duration: 500});
expanded = false;
    </script>
<script>
     $(function () {
            $("#button2").click(function () {
                $("#div").animate({'top' : '-190px'}, {duration: 500});
</script>

Answer 1

Add the code marked in red:
<script>
$(function() {
var expanded = false;
$('#needhelp').click(function(){
$('#needhelp').hide();                         
if (!expanded) {
$('#guidepopup').animate({'top' : '141px'}, {duration : 500});
expanded = true;
else {
$('#guidepopup').animate({'top' : '50px'}, {duration: 500});
expanded = false;
$("#button2").click(function () {
if (expanded == true) {
$("#guidepopup").animate({'top' : '50px'}, {duration: 500});
expanded = false;
$('#needhelp').show();
</script>