Split Paragraph's Into Buttons

HTML

<p>This is a test.</p>
<p>Why is this a test?</p>
<p>Because it has multiple elements!</p>

CSS

span {
    border: 1px solid red;
}

JavaScript

var pElements = []; // Holds the split paragraphs for each p tag

//Loop through each p tag in web page
$("p").each(function(webPElementIndex, webPElement) {

		var jQObjWebPElement = $(webPElement);// Convert p element to jQuery Obj
    
    // split current paragraph element text into an array of seperate words
    pElements[webPElementIndex] = jQObjWebPElement.text().split(" ");

});

//Clear text out of all p elements
$("p").empty();

var pElementIndex = 0;

//Loop through p elements in the webpage to add back text with spans around each word
$("p").each(function(webPElementIndex, webPElement) {
    
		var jQObjWebPElement = $(webPElement); // convert current web page element to jQuery Obj
        
    // Loop through each word stored in each stored paragraph element
    $.each(pElements[pElementIndex], function(pElementWordIndex, pElementWord){
        	     
        var jQObjPElementWord = $(pElementWord); // convert element to jQuery object
            
        jQObjWebPElement.append($("<button>").text(pElements[pElementIndex][pElementWordIndex]));

    });
    pElementIndex = pElementIndex + 1;
    
});

alert(count);