'How to add class into html tag manually by PHP

I want to add class "dropdown-toggle" into <a href="#">Additional< /a> this tag but as there is no class before that's why "str_replate" not working perfectly.

I want to add class for only this tag using php there are also <a> tag but I don't want to add the same class for all. I hope you understand. See my code:

<li id="menu-item-97" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-97">


    <a href="#">Additional</a> ***I want to add class for only this "<a>" tag not others tag***
**after adding the class the tag will be "< a class="dropdown-toggle" href="#">Additional< /a>"***


    <ul class="sub-menu">
        <li id="menu-item-69" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-69">
            <a href="http://localhost/wp-web/simpleshop/checkout/">One</a>
        </li>
        <li id="menu-item-68" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-68">
            <a href="http://localhost/wp-web/simpleshop/cart/">Two</a>
        </li>
        <li id="menu-item-70" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-70">
            <a href="http://localhost/wp-web/simpleshop/my-account/">Three</a>
        </li>
    </ul>
</li>


Solution 1:[1]

I prefer using javascript for adding class instead instead of php because it is more convenient and used in every type of extension files.

Here is the answer

<li id="menu-item-97" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-has-children menu-item-97">

<a href="#" onclick="myFunction()">Additional</a> ***I want to add class for only this "<a>" tag not others tag***
**after adding the class the tag will be "< a class="dropdown-toggle" href="#">Additional< /a>"***

<ul class="sub-menu">
    <li id="menu-item-69" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-69">
        <a href="http://localhost/wp-web/simpleshop/checkout/">One</a>
    </li>
    <li id="menu-item-68" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-68">
        <a href="http://localhost/wp-web/simpleshop/cart/">Two</a>
    </li>
    <li id="menu-item-70" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-70">
        <a href="http://localhost/wp-web/simpleshop/my-account/">Three</a>
    </li>
  </ul>
</li>

<script>
   function myFunction() {        
     var element = 
       document.getElementById("myDIV");            
       element.classList.add("mystyle");
      
    }
</script>

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Dave