Adding HTML <div> inside of element using WordPress functions.php

I want to add a div with a class inside of a existing element in WordPress/Woocommerce. I want to make the sale price more pretty :) Let's start with what I have now: enter image description here

Code:

<ins>
    <span class="woocommerce-Price-amount amount">
        <bdi>
            <span class="woocommerce-Price-currencySymbol">$</span>200.00
        </bdi>
    </span>
</ins>

And this is what I am trying to achieve: enter image description here

Code:

<ins>
    <span class="woocommerce-Price-amount amount">
        <div class="vh-badge-ears"></div>
        <bdi>
            <span class="woocommerce-Price-currencySymbol">$</span>200.00
        </bdi>
    </span>
</ins>

the closest I have come to is adding this code to my functions.php:

function bd_sale_price_html( $price, $product ) {
  if ( $product->is_on_sale() ) :
    $return_string = str_replace( '<ins><span class="woocommerce-Price-amount amount">', '<ins><span class="woocommerce-Price-amount amount"><div class="vh-badge-ears"></div>', $price);
    return $return_string;
  else :
    return $price;
  endif;
}
add_filter( 'woocommerce_get_price_html', 'bd_sale_price_html', 100, 2 );

But by using this code it looks like this: enter image description here

I hope someone here could help me out.

Kind regards!