如何让wordpress回应我的导航

I started building my template on my server and then realised I wanted to opt for WordPress 4.0 but can't figure out how to get WordPress to use the following structure I've tried reading the documentation and looking up the functions etc, but really can't figure out how to do it this is my last choice, any help is greatly appreciated.

<ul class="main-menu clearfix">
    <li><a href="<?php echo $site_data['url']; ?>">Home</a></li>
    <li><a href="<?php echo $site_data['url']; ?>">News</a></li>
    <li><a href="<?php echo $site_data['url']; ?>">Games</a>
        <div class="dropdown clearfix">
            <div class="arrows">
                <span class="arrowOuter"></span>
                <span class="arrowInner"></span>
            </div>
            <ul>
                <li><a href="<?php echo $site_data['url']; ?>">Dropdown Link 1</a></li>
                <li><a href="<?php echo $site_data['url']; ?>">Dropdown Link 2</a></li>
            </ul>
        </div>
    </li>
    <li><a href="<?php echo $site_data['url']; ?>">Media</a></li>
    <li><a href="<?php echo $site_data['url']; ?>">Shop</a></li>
    <li><a href="<?php echo $site_data['url']; ?>">Community</a></li>
</ul>

The code to use here is wp_nav_menu.

<?php wp_nav_menu( array( 'theme_location' => 'header-menu' ) ); ?>

See http://codex.wordpress.org/Navigation_Menus

I Found out what the issue was after lots of hunting the internet i finally found it...

<?php wp_nav_menu(
array(
    'container' => 'ul',
    'menu_id'=> 'header-menu',
    'menu_class'=> 'main-menu clearfix'
));
?>

Just need to use jquery .append to append the arrows div