$('input').on('change', function () {
console.log(this.outerHTML);
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="one">one</label><input type="radio" name="tar" id="one" checked>
<label for="two">two</label><input type="radio" name="tar" id="two">
<label for="three">three</label><input type="radio" name="tar" id="three">
<label for="four">four</label><input type="radio" name="tar" id="four">The change event seems to only be fired once when the selected radio button is changed, and only for the radio button which has just been selected.
So in the above demo, whichever button you click on, that is the button that you get shown the HTML of.
However, I would like the listener to be run against the previously selected radio button element as well as the new one.
How can I do that?
Consider please following.
To store a selection in variable, i.e. at the beginning and after each update.
Please see the snippet, where variable "pastEl" is used for it.
var rbName = 'tar';
var newEl = null, pastEl = null;
function print(el) {
console.log(el.outerHTML);
}
(function() {
pastEl = $(`input[name="${rbName}"]:checked`)[0];
$('input').on('change', function () {
newEl = $(this)[0];
print(pastEl);
print(newEl);
pastEl = newEl;
});
})();<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="one">one</label><input type="radio" name="tar" id="one" checked>
<label for="two">two</label><input type="radio" name="tar" id="two">
<label for="three">three</label><input type="radio" name="tar" id="three">
<label for="four">four</label><input type="radio" name="tar" id="four">I'm not sure if this is what you are looking for but I hope it works for you. Try this JS code
var num1
var num2
$('input').on('click', function () {
num2=num1
num1 = this.outerHTML;
console.log(num2)
console.log(num1)
});
It could also work with $('input').on('change', function ()
Let me know if it helped you