how to pass two cookies together to another html-page?

Question

Hi

I'm trying to pass firstname and name from a html page to another html page (without using server code like php or asp.net) using cookies. This works partially because i get the firstname in the first input of the page action.html but also in the second input. How can i get the name in the second input in action.html?
Thanks
V.

first page:
<form action="action.html">
        <label>Firstname:</label><br>
        <input type="text" id="vn" autofocus ><br>
        <label>Name:</label><br>
        <input type="text" id="an"><br><br>
        <input type="submit" onclick="MakeCookie()">
    </form>
    <script type="text/javascript">
        function MakeCookie()
        {
            var vn = document.getElementById("vn").value;
            var an = document.getElementById("an").value;
            document.cookie = an;vn;
        }
    </script>
-----------------------
action.html:

 <input id="vn" type="text" />
 <input id="an" type="text" />
 <script type="text/javascript">
   cc = document.cookie.split(";");
   document.getElementById("vn").value = cc;
   document.getElementById("an").value = cc;
 </script>