JSFiddle - React, Tailwind, and code Playground

by Alex Baumgertner

HTML

<!DOCTYPE html>
<html>
<head>
  <title>jQuery double event firing on label without for</title>
</head>
<body>
    
    <form action="">
        <label class="label-wo-for">
            one
            <input type="radio" name="name" value="one">
        </label>
        <label class="label-wo-for">
            two
            <input type="radio" name="name" value="two">
        </label>
         <label class="label-wo-for">
            three
            <input type="radio" name="name" value="three">
        </label>
    </form>
    
    <div id="log" style="margin: 25px 0 0 0;">
        
    </div>

</body>
</html>

JavaScript

$(function(){
    
    function logging(log){
        $('#log').append(log)                
    }
    
    $('.label-wo-for').on('click', function(){
        logging('<p>fire event</p>');
    });
});