I am pretty sure a setup like this isn't possible. The way virtual servers in apache work is this (we'll start from the top of http - 24.x.x.x is your house's IP address)
a web browser looks up www.example.com
and gets 220.127.116.11
It opens a connection on port 80 to 18.104.22.168
GET / HTTP/1.1
and from the host header Apache knows which page to serve
Now what you're saying is that www.example.com
will both be pointed at 22.214.171.124 (your house) while your friend's server is there. But web browsers, when they open a connection to your house, aren't specifying the host name. they are only specifying IP address - until the connection is open, i.e. they are already talking to one web server or the other, and it is too late for you to decide which server they should be talking to.
So, you need either:
a) two EXTERNAL (real) IP addresses that can each be pointed to one of the web servers
b) some sort of script on your existing web server that could serve up pages from the other. This wouldn't be too hard to write in PHP or Perl but if you don't already know how to do that, it's not going to be easy to explain in this venue.