Dynamically add page to Polymer iron-pages

Question

Is there any way to add a new page to iron-pages dynamically? I have this iron-pages:

<iron-pages selected="0">
  <div>Abc</div>
</iron-pages>

And then I add a couple more pages dynamically:

document.addEventListener("WebComponentsReady", function() {
  var newDiv = document.createElement("div");
  newDiv.innerHtml = "Def";
  var ironPage = document.querySelector("iron-pages");
  ironPage.appendChild(newDiv);
  console.log(ironPage.items.length) // log 1 instead of 2
  ironPage.select(1) // nothing shown.
});

Answer 1

you might need to use the Polymer.Dom Api

Polymer.dom(ironPage).appendChild(newDiv);

Also I think you may have made another error:

instead of

newDiv.innerHtml = "def";

do

newDiv.textContent = "def";