replace html issue

I defined new forum block like this.

blockManager.add('block-forum', {
		label: 'Blog, Discussion or Forum',
		attributes: {class: 'fa fa-list-alt'},
		content: `
			<DIV class='forum_directory'>
				<div class="resource"  data-gjs-editable="false" data-gjs-selectable="false" data-gjs-hoverable="false" data-gjs-propagate='["editable", "selectable", "hoverable"]'>
					Select an item in the configuration panel on the right.
				</div>
			</DIV>`,
		category: 'Other',
});

I want to replace resource class with ajax response html. Currently I did it like this.

var replaceResource = function(model, data) {
		if (model) {
			var element = model.view.$el;
			var object = element.find('.resource')[0];
                        object.innerHtml = data;
		}
	};

The problem is Hover is not working after this replacing. The data contains several div tags. I want to make hover action working correctly for the forum_directory class.