javascript - Unable to get div width/height -

javascript - Unable to get div width/height -

i found illustration of simple how display pop near click: http://roshanbh.com.np/examples/popup-message/

i'm leveraging button click, can't seem actual width or height of element , i'm not exclusively sure why:

function bindobject(o) { o.click(function(e) { var editor = $(this).find(".object_editor"); console.log(editor); console.log(editor.height()); }); }

here printed console:

(fyi only, bindobject called on document ready, using jqote well, not sure how relevant is, might be)

$("#questcontent").html($("#questtemplate").jqote(quest_data)); $("#questcontent").find(".object").each(function() { bindobject($(this)); });

it finds element (represented editor), i'm unable determine it's width or height. know display set none, that's because don't want display until clicks button display pop up. have ideas why it's null?

here css:

.object_editor{ position:absolute; z-index:10; width:172px; height:102px; text-align:center; color:#ffffff; font: 14px verdana, arial, helvetica, sans-serif; background-color:#000000; display:none; }

edit: , relevant jqote in case it's needed:

<!-- object template --> <script type="text/x-jqote-template" id="objecttemplate"> <![cdata[ <span class="object <%= (this.hidden ? "hiddentype" : "") %>">&nbsp; <input class="objecttype" type="hidden" name="<%= this.key[0] %>" value="<%= this.type %>"> <input class="objectentry" type="hidden" name="<%= this.key[1] %>" value="<%= this.entry %>"> <a data-emptytext="<%= object_types[this.type] %>" data-name="<%= this.key[1] %>" target="_blank" href="<%= (this.entry? whurl(this.type, this.entry) : "#") %>" class="objectname"><%= this.name %><%= (this.entry?" ("+this.entry+")":"") %></a>&nbsp;<i class="icon-edit editobject"></i> &nbsp; <% if(this.remove) { %> <a href=".object" class="deleteparent"><i class="icon-trash"></i></a> <% } %> </span> <!-- insert our editor --> <%=$("#objecteditortemplate").jqote({type: this.type, entry:this.entry}) %> ]]> </script> <!-- object editor template --> <script type="text/x-jqote-template" id="objecteditortemplate"> <![cdata[ <div class="object_editor">my editor: <%= this.entry %></div> ]]> </script>

the reason because display set none. see this similar question.

javascript jquery css jqote