Comment insérer un élément entre les deux éléments dynamiquement?

Question

J'utilise une table, dans laquelle il y a des boutons, sur le bouton cliquez sur Je veux le nouvel élément TR à insérer entre les deux TR ou à la fin du TR ... mon code va ici

<table> 
<tbody> 
    <tr> 
    <td> 
     <input type="submit" value="Add" onclick="addFunction()" /> 
    </td> 
    </tr> 
    <tr> 
    <td> 
     <input type="submit" value="Add" onclick="addFunction()" /> 
    </td> 
    </tr> 
    <tr> 
    <td> 
     <input type="submit" value="Add" onclick="addFunction()" /> 
    </td> 
    </tr> 
    </tbody> 
</table> 

je veux insérer nouvel élément TR à côté de l'élément qui a déclenché l'événement ... NOTE: Je n'utilise une librairie javascript, juste javascript plaine

Answer 1

<table> 
<tbody> 
    <tr> 
    <td> 
     <input type="submit" value="Add" onclick="addFunction(this)" /> 
    </td> 
    </tr> 
    <tr> 
    <td> 
     <input type="submit" value="Add" onclick="addFunction(this)" /> 
    </td> 
    </tr> 
    <tr> 
    <td> 
     <input type="submit" value="Add" onclick="addFunction(this)" /> 
    </td> 
    </tr> 
    </tbody> 
</table> 

function addFunction(input) 
{ 
    var newTr = document.createElement("tr"); 
    var curRow = input.parentNode.parentNode; 
    curRow.parentNode.insertBefore(newTr, curRow.nextSibling); 
}