Is it correct that page elements created by jQuery do not show up in the source code

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 they do NOT show up,

elements created with javascript arent't visible in the 'View source' part of the browser.

Answer 2

Yes. The elements are added directly to the DOM, and not visible via normal view source.

Answer 3

Yes, this is correct.

In firefox you can see the latest source by selecting everything on the page (ctrl+a) and then using rightmouse+view selection source. Or even better, you should install firebug.

Answer 4

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.

Answer 5

You could use FireBug to find it if you needed to see it in action.

Answer 6

My problem is related to this. I'm not able to use jquery to dynamically created elements. I cn't see those elements in page source as well.

Please do suggest !!