I am attempting to give my admins a mouseover of the element they are hovering over to give them a clue to what to edit, if anything. Here is my code:
$(document).tooltip(); $(document).on('mouseover','*',function(){ $(this).attr('title',$(this).prop('id')); console.log($(this)); }).on('mouseout',function(){ $(this).attr('title',''); }); This works great for elements with an id. What I need to get is a combination of html element and id (if any) on mouseover.
If I understood you correctly, when you hover over an element, you want the id of the element as well as the element type (tag name). If that's the case, then you can use the following:
$(document).on('mouseover','*',function(){ var id = this.id; var elementType = $(this).prop('nodeName'); // will give you element tag name // do something with id and elementType }).on('mouseout',function(){ $(this).attr('title',''); }); 
You should be able to short that code using this.id instead of $(this)... Also check your console and pick w/e you need from there and use || operator to pick the one that suits you best.
$(document).on('mouseover','*',function(){ $(this).attr('title',(this.id || some_other_things || yet_another_one)); console.log($(this)); console.log(this); }).on('mouseout',function(){ $(this).attr('title',''); }); If id is not defined then get the tagName property of the dom element.
$(this).attr('title', this.id || this.tagName); 
$(this).prop('nodeName')