Find selector in array

Question

I have to find and display a selector from HTML presented in array, this works for me using Jquery:

var a = '';
var b = Array.prototype.map.call($('p', a),
 function(e) { return e.outerHTML; });
console.log(b)

However I don't want to use Jquery, Id rather use plain Javascript so I tried:

a.querySelectorAll('p')

Not working. Why is that and what else can I try?

• gen_Eric: What's a. Is it a DOM element or a string? Also, what's not working? What error do you see?
• adeneo: Works just fine -> jsfiddle.net/knh2n8wy
• Youss: I was doing something wrong...hard to explain: listening to event DOM mutations and try to alter them but now I realize I was just calling from the DOM...anyway Im going to accept an answer as it fits the question. a= array from mutation record and console says 'undefined is not a function'
• Joseph Ahn: You might be getting the 'undefined is not a function' error because the querySelectorAll function is being looked up in the Array.prototype. Because querySelectorAll is not found, a.querySelectorAll will return undefined. Finally, trying to invoke an undefined value will cause that error. Try this (for example): var und = undefined; und();
• Youss: @Joseph Ahn I know, but I thought I was doing something else. But when I saw that document.queryselector worked I realized I was just calling things from the document instead from within the scope of my mutation function (arrays/strings and what else)

Answer 1

You're using querySelectorAll as if it is available in the String.prototype object because the variable a is an empty string.

Try document.querySelectorAll('p');

Answer 2

I think what you want is this:

var b = Array.prototype.map.call(document.querySelectorAll("p"),
 function(e) { return e.outerHTML; });
console.log(b);

This way your calling the query selector on the document rater than on an empty string(where the function won't exist).

Answer 3

Try this:

document.getElementsByTagName("p")

Which will return an array of all <p> tags