Unable to disable the click event from element with simple JavaScript

advertisements

I'm trying to detach click event from several p elements via plain JavaScript. I'm able to access these p elements, but for some reason I'm not able to remove the click listener. It works fine with jQuery, but not with pure JS. getP_element function is called upon page load. Here's my code:

function getP_element(){
    console.log("page loaded");
    var p_array = document.getElementById("checkboxesContainer").getElementsByTagName("p");
                for(var i=0;i<p_array.length;i++){
                    p_array[i].onmousedown = new function(){
                        return false; //this doesnt work
                    }
                }
    $("#checkboxesContainer p").click(false); //this works
}

EDIT: More info about what's happening here. I created several custom checkboxes with custom style. Fore some reason the checkboxes get selected even when the user clicks on the p tags, so I figured I need to detach the click events. This is how they are defined inside my HTML:

<div id="checkBoxDiv2" class="checkBoxDiv">
                <input type='checkbox' value='someValue' id="checkBox2"/>
                <label for="checkBox2"><p class="checkBoxText">some text goes here</p>
                    <span></span>
                </label>
            </div>


You don't need to disable the click event.

The checkboxes are getting selected when you click on the p because you have the p tag inside a label which has for="checkBox2"

That's what it's meant to be doing.

Remove the for and it will prevent clicking the label from activating the correspinding input element