Question

I have the following code (snippet):

 var numRows = $table.find('tbody tr').length;
var numPages = Math.ceil(numRows / numPerPage);
var $pager = $('<div class="pager"></div>');
for(var page =0; page < numPages; page++) {
 $('<span class="page-number">' + (page + 1) + '</span>')
  .appendTo($pager).addClass('clickable');
  }
 $pager.insertBefore($table);

Is it correct that when I view the page source I don’t see the "<div class="... code?

Answer 1

Yes. The source is just used to build the initial DOM that represents the document. Dynamically created elements are only inserted in the DOM.

But you can analyse such elements with a DOM viewer like Safari’s WebInspector or the Firefox extionsion Firebug. Firefox can also show source code that represents such dynamically created elements by selecting that element an choosing View Selection Source in the context menu.