JavaScript Test : Create Event

by JS Test

HTML

<script src="https://getfirebug.com/firebug-lite.js"></script>
<h1 id="h1">
Create Event
</h1>
<p class="normal" id="p1">
  THis is paragraph 1
</p>
<input type="text" id="text1">
<p id="p2">
  This is paragraph 2
</p>
<input type="text" id="text2">
<br>
<input type="button" id="toggleBtn" value="Clear">
<input type="button" id="triger" value="Go!">

CSS

h1 {
  color: red;
  font-size: 24pt;
  font-style: italic
}

body {}

.normal {
  color: blue;
  font-size: 15;
  font-family: Arial
}

.visible {
  display: none
}

.white {
  color: white
}

JavaScript

var text1 = document.getElementById("text1");
var text2 = document.getElementById("text2");
document.getElementById("p1").onclick = function() {
  text1.value = "clicked";
};
document.getElementById("p2").onclick = function() {
  text2.value = "clicked";
};
document.getElementById("toggleBtn").onclick = function() {
text1.value = "";
  text2.value = "";
};

document.getElementById("triger").onclick = trigerEvent;


function trigerEvent() {
var evt =new Event("click",{bubbles:true,cancelable:true});
document.getElementById("p1").dispatchEvent(evt);
document.getElementById("p2").dispatchEvent(evt);
}