Edit in JSFiddle

window.addEventListener("message", function(e) {
  var confirmacion = document.getElementsByTagName("small")[0],
      origenRemoto = e.origin;

  if(origenRemoto ==  "http://lordcaos.com.ve") {
    confirmacion.innerHTML = "Confirmación el iframe con origen " + origenRemoto +
    " ha recibido el mensaje que le hemos enviado y lo ha notificado";
  }
}, false);


  var iframe = document.getElementById("remoto"),
      textarea = document.getElementById("mensaje");
      button = document.getElementsByTagName("button")[0];

  button.onclick = function( e ) {
    e.preventDefault();
    console.log(textarea.value);
      console.log(iframe);
    iframe.contentWindow.postMessage(textarea.value, "http://lordcaos.com.ve/ejemplos/postMessageRemoto/remoto.html")
  };

<div class="container">
  <header clas="row">
    <h1>Ejemplo de postMessage</h1>
    <p>Enviando texto a iframe cross-origin</p>
  </header>

  <div class="row">
    <div class="col-lg-4 col-lg-push-4">
      <form class="form form-responsive">
        <label for="#mensaje">Mensaje</label>
        <textarea class="form-control" name="mensaje" id="mensaje" placeholder="El mensaje escrito será enviado al iframe remoto (abajo)"></textarea>
        <button class="btn btn-primary btn-block">
          Enviar mensaje
        </button>
        <small class="help-text"></small>
      </form>
    </div>
  </div>

  <div class="row">
    <h2>
      <a href="http://lordcaos.com.ve/ejemplos/postMessageRemoto/remoto.html">
        Remoto
      </a>
    </h2>
    <iframe id="remoto" class="col-xs-10 col-xs-push-1 col-lg-6 col-lg-push-3" src="http://lordcaos.com.ve/ejemplos/postMessageRemoto/remoto.html"></iframe>
  </div>
</div>

header h1,
header p,
h2 {
  text-align: center;
}

form.form {
  margin-bottom: 25px;
  margin-top: 25px;
}