Magento 2.3 Show Text with Shipping Option

Question

I have created a shipping option and wanted text to show if that option was selected. Right now it displays below all of the shipping options and I want it to display with the method (not below all of them) if that method is selected.

frontend/layout/checkout_index_index.xml

<item name="shipping-step" xsi:type="array">
    <item name="children" xsi:type="array">
        <item name="shippingAddress" xsi:type="array">
            <item name="children" xsi:type="array">
                <item name="shippingAdditional" xsi:type="array">
                    <item name="component" xsi:type="string">uiComponent</item>
                    <item name="displayArea" xsi:type="string">shippingAdditional</item>
                    <item name="children" xsi:type="array">
                        <item name="shipping-info-wrapper" xsi:type="array">
                            <item name="component" xsi:type="string">My_Module/js/view/customjs</item>
                            <item name="provider" xsi:type="string">checkoutProvider</item>
                            <item name="sortOrder" xsi:type="string">0</item>
                        </item>
                    </item>
                </item>
            </item>
        </item>
    </item>
</item>

js/view/customjs

define([
    'uiComponent',
    'ko',
    'Magento_Checkout/js/model/quote'

], function (Component, ko, quote) {
    'use strict';

    return Component.extend({
        defaults: {
            template: 'My_Module/customtemp'
        },

        initObservable: function () {
            var self = this._super();
            this.showFreeShippingInfo = ko.computed(function () {
                var method = quote.shippingMethod();

                if (method && method['carrier_code'] !== undefined) {
                    if (method['carrier_code'] === 'freeshipping') {
                        return true;
                    }
                }

                return false;

            }, this);

            this.showPickUpShippingInfo = ko.computed(function () {
                var method = quote.shippingMethod();

                if (method && method['carrier_code'] !== undefined) {
                    if (method['carrier_code'] === 'instorepickup') {
                        return true;
                    }
                }

                return false;

            }, this);

            return this;
        }
    });
});

web/template/customtemp.html

<div class="free-shipping-info" data-bind="visible: showFreeShippingInfo()" style="display: none;">
    <div class="step-title" data-role="title" data-bind="i18n: 'Free Shipping Information'"></div>
    <p class="desc" data-bind="i18n: 'Free shipping can take up to 2 weeks.'"></p>
</div>
<div class="pickup-shipping-info" data-bind="visible: showPickUpShippingInfo()" style="display: none;">
    <div class="step-title" data-role="title" data-bind="i18n: 'In-store Pickup'"></div>
    <p class="desc" data-bind="i18n: 'You have chosen In-store Pickup'"></p>
</div>

How can I show the info with the option when it is selected?

Thanks!