سؤال في جافاسكريبت

السلام عليكم

انا قاعد اسوي برنامج بلغه جافاسكريبت 

واحتاج كود او مكتبه فيها كود زي innerHTML بس لما اكتب الكود مرتين ماينحذف محتوى الاول

مثال:

var div = document.getElementById("div");
var button1 = document.getElementById("button1");
var button2 = document.getElementById("button2");
button1.addEventListener("click",()=>{ div.innerHTML="<p>test1</p>";});
button2.addEventListener("click",()=>{ div.innerHTML="<p>test2</p>";});

زي ما تشوفون حطيت كود addEventListener في البدايه لما ينضغط الزر الاول

وحطيت الكود مره ثانيه للزر الثاني بس لما اضغط الزر الثاني يصير محتوى div من test1 الى test2

وانا ابي يصير من test1 الى test1test2

في حل للمشكله؟


اذا كنت لاتريد مسح المحتوى السابق عليك اضافة النص الجديد اليه بوضع علامة + قبل علامة =

كالتالي:

div.innerHTML +="<p>test2</p>";