Convert jQuery .on event listeners to their native JS equivalents

[Jaifroid]

This is a sub-issue of #367.

[dheerajdlalwani]

Shall I take up this one too? Seems like the logical next step after closing #927.

[Abhishek-1337]

This seems beginner friendly. Works for me. Can you help me to start?

[Jaifroid]

@Abhishek-1337 Thank you for offering to work on this issue. Please read carefully the whole of the CONTRIBUTING document. The only thing that's out of date there is the mention of removing -WIP to test the Chromium extension (I'm not using -WIP label any more). When you've set up and can access/edit the app's code (you should make a dedicated branch on your clone to work on it), let me know, and I can guide you with regard to the specifics of this issue.

[Abhishek-1337]

@Jaifroid Hey I have a doubt that I am facing. So while changing .on event listener for a specific element suppose there's an element which has (id= prefix), Now when I convert $('#prefix).on() to document.getElementById('prefix') there are code that looks like document.getElementById('prefix').value, So I want to ask can I use document.getElementById once for that element store it in a variable and then use that variable for other part of code.
Sorry this is my first time and this might be a stupid question.

[Jaifroid]

@Abhishek-1337 If you're going to re-use the value in document.getElementById('prefix').value then of course you can assign it to a variable and just use the variable instead of getting the value again each time you need it.

[Rishabhg71]

@Jaifroid if the issue is still open do you mind giving it to me
i would be happy to this task under your mentorship since i am new to this repo