I would appreciate if someone can help me, I've been working on a website, haven't finished it yet but usually I get a preview online and check to see if everything is perfectly aligned and working , I upload the whole website on the server but when I check the website http.... / and name of what uploaded including the index.html it doesn't appear at all. I checked the links correctly and they seem to be working fine locally but not on the server,I'm sure it was done correctly.I don't know what to do,I need to finish this website as there is another one on the way to do and time is running out on me like mad. I'll mention that the menu of the website are js connected,also that the website is in html5 format not 100 percent sure though.Here are the links of the main html page and the js menu code.I would deeply appreciate it.

the menu links in html5 or html:


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

<div class="nav-wrap">
<ul class="group" id="example-one">
<li class="current_page_item"><a href="index.html">Home</a></li>
<li><a href="bio .html">Biography</a></li>
<li><a href=" art.html">Art</a></li>
<li><a href="sculptures.html">Sculptures </a></li>
<li><a href="events.html>Events</a></li>
<li><a href="contact.html">Contact</a></li>

</ul>
</div>

on the html code i have it does include the stylesheet and js for this menu so this isn't the issue.Is making the server connect with those links so they appear online uff



this is the script of the menu in js format:

$(function(){

var $el, leftPos, newWidth,
$mainNav = $("#example-one"),
$mainNav2 = $("#example-two");

/*
EXAMPLE ONE
*/
$mainNav.append("<li id='magic-line'></li>");

var $magicLine = $("#magic-line");

$magicLine
.width($(".current_page_item").width())
.css("left", $(".current_page_item a").position().left)
.data("origLeft", $magicLine.position().left)
.data("origWidth", $magicLine.width());

$("#example-one li").find("a").hover(function() {
$el = $(this);
leftPos = $el.position().left;
newWidth = $el.parent().width();

$magicLine.stop().animate({
left: leftPos,
width: newWidth
});
}, function() {
$magicLine.stop().animate({
left: $magicLine.data("origLeft"),
width: $magicLine.data("origWidth")
});
});


/*
EXAMPLE TWO
*/
$mainNav2.append("<li id='magic-line-two'></li>");

var $magicLineTwo = $("#magic-line-two");

$magicLineTwo
.width($(".current_page_item_two").width())
.height($mainNav2.height())
.css("left", $(".current_page_item_two a").position().left)
.data("origLeft", $(".current_page_item_two a").position().left)
.data("origWidth", $magicLineTwo.width())
.data("origColor", $(".current_page_item_two a").attr("rel"));

$("#example-two li").find("a").hover(function() {
$el = $(this);
leftPos = $el.position().left;
newWidth = $el.parent().width();
$magicLineTwo.stop().animate({
left: leftPos,
width: newWidth,
backgroundColor: $el.attr("rel")
})
}, function() {
$magicLineTwo.stop().animate({
left: $magicLineTwo.data("origLeft"),
width: $magicLineTwo.data("origWidth"),
backgroundColor: $magicLineTwo.data("origColor")
});
});
});



please help