Исправить?) Блоки игнорируют float-элементы, и это написано в спецификации. А текст учитывает, да.
Так что ваш вопрос звучит так: «Как извратиться и сделать так, чтобы ...?».
Вы неправильно пример сделали — не в те поля код вставили, jQuery не подключили. Не пользовались jsfiddle Никогда?
Вот исправленный. Работает, как и ожидалось jsfiddle.net/petroveg/8jtLotxg/6
Использование jQuery-объектов и их метода для хранения. Чтобы было понятно, задайте себе вопрос — почему вторым аргументом в data() можно передавать ссылку на объект?
В jQuery data-атрибут — стартовое значение, не более того.
Что вовсе не отменяет вашей правоты относительно использования именно таких атрибутов. И хранить в атрибутах можно только строки.
M-ka: jQuery всегда в процессе траверса создаёт массив элементов, независимо от того, каким селектором вы пользуетесь. Для id будет массив из одного элемента, будет ли на странице их несколько, или один.
Именно про эту особенность jQuery я вам написал, но вы предпочли не понять.