Show and set multiple attributes of an element using attr() in jQuery's attr() method [mainly style attribute]

Question

I am learning jQuery from W3school and stuck into a problem when I tried to show the multiple attributes of the h3 tag given below using attr() method

<h3 class="test" style="color: white; background: coral">This is the <a href="#">H3 </a>
        tag and this will be our <strong style="color: teal">DEMO</strong> tag</h3> 

<button id="attr">Show Attribute</button>

<script>
$('#attr').click(function () {
                alert($('h3').attr('style'))
            })
<script>

How can I show style,class and other attributes of the <h3> ?

Second problem is that what if I want to change the style from the given one to style="color: black; background: teal" and class='newClass' using the SET attr()?

$('#setattr').click(function () {
                $('h3').attr('style:"color: black; background: lightpink')
            })

Doesn't seem to show any affect to the HTML. where #setattr is the id of the button.

`.attr` accepts an object for when you want to set multiple attributes at once https://api.jquery.com/attr/ — CertainPerformance, Aug 22 '19 at 07:12
For getting all attributes see https://stackoverflow.com/questions/14645806/get-all-attributes-of-an-element-using-jquery — Adam Kosmala, Aug 22 '19 at 07:15

Show and set multiple attributes of an element using attr() in jQuery's attr() method [mainly style attribute]

0 Answers0