my second double-click function not working

Question

When clicking on a specific div, I want another div to create a new p style with text in it.

The first function created worked fine- whoever the second one seems to overrule the first one. I've tried changing the names of basically everything but it still seems to overrule. How could I solve this?

  var para = document.createElement("P");
  para.innerHTML = "The Siamese crocodiles share one stomach, yet they fight over food.";
  document.getElementById("information").appendChild(para);
}
    window.onload = function() {
        document.getElementById("i29").ondblclick = function i29i() {
            i29();
        }
    }



function i3() {
  var para = document.createElement("P");
  para.innerHTML = "When you climb a good tree, you are given a push.";
  document.getElementById("information").appendChild(para);
}

    window.onload = function() {
        document.getElementById("i3").ondblclick = function i3i() {
            i3();
        }
    }```

Answer 1

you are resetting the window.onload to another value when you assign it to a different function twice. The simplest solution would be to do the following:

window.onload = function() {
    document.getElementById("i29").ondblclick = i29;
    document.getElementById("i3").ondblclick = i3;
}

Answer 2

You coud do it like this:

HTML:

<div onClick="firstClick()">First</div>
<div onClick="secondClick()">Second</div>

<div id="information"></div>

JS:

    function firstClick(){
        var para1 = document.createElement("P");
        para1.innerHTML = "The Siamese crocodiles share one stomach, yet they fight over food.";
        document.getElementById("information").appendChild(para1);
        }
    function secondClick(){
        var para2 = document.createElement("P");
        para2.innerHTML = "When you climb a good tree, you are given a push.";
        document.getElementById("information").appendChild(para2);
    }