Get the value of an attribut and paste it in jQuery

March 28, 2023

So, I have 2 buttons each having an attribute and a value inside it. Now In my jQuery code, I’m trying to paste the value of the attribute of which of that buttons was clicked.

So the problem here is this when I click one of the buttons it doesn’t update the value in cookies from that attribute. I also get something else as a value when clicked on one of the buttons. I left a screenshot down below.
screenshot

$(document)['ready'](function() {
  $("[accent-switcher]").each(function(accentSwitcher) {
    $(this)['click'](function() {
      ips['utils']['cookie']['unset']('ipsTheme_type');
      ips['utils']['cookie']['set']('ipsTheme_type', $(this).val($(this).attr("accent-switcher")), true)
    });
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>


<button class='ipsButton' accent-switcher="blue">Color A</button>
<button class='ipsButton' accent-switcher="yellow">Color B</button>

>Solution :

Try this instead, this should work, or try the ‘run code snippet’ button to test it out for yourself

$( document ).ready(function() {
    $( "html body .ipsButton" ).on( "click", function() {
        var accentSwitcher = $(this).data('accent-switcher');
        alert('accent-switcher:' + accentSwitcher);
    });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<html>
    <body>
        <button class="ipsButton" data-accent-switcher="blue">Color A</button>
        <button class="ipsButton" data-accent-switcher="yellow">Color B</button>
    </body>
</html>